Bootstrap açılır menüsü kapanıyor

Question

Bootstrap 3'ü Ruby on Rails (Rails Öğreticisi Örnek Uygulaması) ile kullanıyorum. Uygulamamda, bir kullanıcı mikrofonları ("beğen") beğenebilir ("pops"). Bir gönderide sıfırdan fazla beğenme olduğunda, bir açılır menüde beğenen kullanıcıların Gravatar simgelerini görüntülemek için '# beğen' ekran düğmesinin olmasını istiyorum. Az çok çalışıyorum. Ancak, butona tıkladığımda ve açılır menü açılırken, birkaç saniye içinde otomatik olarak kapanır. Kullanıcı, küçük resimlerden birini veya sayfada başka bir yeri (veya tekrar düğmeyi) tıklayana kadar açık kalmasını istiyorum. Baktığım örneklerin hiçbiri (bunlardan hiçbiri bu soruna sahip değil), bu şekilde küçük resimler kullanmaktadır ve genellikle yalnızca açılır listelerde sıralı listeler vardır. Bunu doğru düzeliyorum mu, yoksa daha iyi bir yolu var mı? Ayrıca, javascript/jQuery uygulamasına gelince tam bir n00b olduğum için ek olarak, ben tam bir n00b olduğum. Kodu anlıyorum, ama nerede koyacağımı ve kodumun çalışmasını istediğim/belirtmem gereken yere karar veremem. Eğer bunun için bir javascript/jQuery düzeltmesi varsa, lütfen tam olarak nereye gitmesi gerektiğini bana bildirin.

NOT: Bu, önce tıklatıldığında açılır menünün kaybolduğu başka bir sorundan farklıdır. Hızlı olursam, küçük resme tıklayabilir ve bağlantıyı iyi inceleyebilirim. Sorun, bir şey üzerine tıklayabilmeden önce (ve üzerinde imlecim varken) menünün genellikle birkaç saniye sonra kaybolmasıdır. Bu özellikle cep telefonunda sinir bozucu bir durumdur, çünkü açılır menü her zaman bir küçük resme dokunmak üzere olduğunuza kadar kapanır. custom.css.scss önceden

.user_avatars { 
    overflow: auto; 
    margin-top: 10px; 
    .gravatar { 
    margin: 1px 1px; 
    } 
    a { 
    padding: 0; 
    } 
} 

Teşekkür gelen

_micropost.html.erb

<li id="micropost-<%= micropost.id %>"> 
    <%= link_to gravatar_for(micropost.user, size: 50), micropost.user %> 
    <span class="user"><%= link_to micropost.user.name, micropost.user %></span> 
    <span class="content"> 
    <%= micropost.content %> 
    <%= image_tag micropost.picture.url if micropost.picture? %> 
    </span> 

    <span class="timestamp"> 
    Popped <%= time_ago_in_words(micropost.created_at) %> ago. 
    <span class="dropdown"> 
     <% if micropost.likers(User).count == 0 %> 
     <div id="like"> 
      <%= pluralize(micropost.likers(User).count, "savor", "savors") %> 
     </div> 
     <% else %> 
     <div class="btn-group"> //button dropdown 
      <button type="button" class="btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown" data-target="#" aria-haspopup="true" aria-expanded="false"> 
      <%= pluralize(micropost.likers(User).count, "savor", "savors") %> 
      <span class="caret"></span> 
      </button> 
      <div class="user_avatars dropdown-menu" aria-labelledby="dropdownMenu1"> 
      <% micropost.likers(User).each do |user| %> 
       <%= link_to gravatar_for(user, size: 30), user %> 
      <% end %> 
      </div> 
     </div> 
     <% end %> 

     <% if current_user.likes?(micropost) %> 
     <%= content_tag(:div, "Savored", class: "btn btn-xs btn-primary", disabled: true) %> 
     <% elsif (current_user != micropost.user) %> 
     <%= link_to 'Savor', micropost, action: :update, method: :put, class: "btn btn-xs btn-primary" %> 
     <% else %> 
     <% end %> 
     <% if current_user?(micropost.user) %> 
     <%= link_to "delete", micropost, method: :delete, 
             data: { confirm: "You sure?" } %> 
     <% end %> 
    </span> 
    </span> 
</li> 

.

Answer 1

Bunu anladım, posta formu her 5000 milisaniyede yenilemek üzere ayarlandı, bu yüzden menüyü kapatmaya devam etti. 30000 (30 saniye) olarak değiştirildi ve her şey yolunda gidiyor.

Suçlu (_feed.html.erb)

<% if @feed_items.any? %> 
    <ol class="microposts" id="refreshable"> 
    <%= render @feed_items %> 
    </ol> 
    <%= will_paginate @feed_items %> 
<% end %> 

<!--make feed refreshable --> 
<script> 
    setInterval(function() { 
    $("#refreshable").load(location.href+" #refreshable>*", ""); 
    }, 30000); 
</script>