Rails 5:在点击时隐藏导航下拉列表

时间:2017-03-05 10:53:51

标签: javascript jquery html css ruby-on-rails

/views/layouts/_navigation.html.erb 我有这段代码,其中点击了下拉菜单:

<div class="dropdown profile-element">
  <span>
    <img alt="image" class="img-circle" src="<%= image_url 'profile_small.jpg' %>"/>
  </span>
     <a data-toggle="dropdown" class="dropdown-toggle" href="#">
       <span class="clear">
         <span class="block m-t-xs">
         <strong class="font-bold"><%= current_user.name %></strong><b class="caret"></b>
         </span>
       </span>
     </a>
     <ul class="dropdown-menu animated fadeInRight m-t-xs">
       <li><%= link_to t('.settings'), edit_user_path(current_user), remote: true %></li>
       <li class="divider"></li>
       <li><%= link_to t('.logout'), logout_path %></li>
     </ul>
</div>

link_to t('.settings')填充AJAX模式窗口,其中显示用户设置。在 /javascripts/layouts/navigation.coffee 中我有这段代码:

$(document).click (event) ->
  clickover = $(event.target)
  $navbar = $('.dropdown profile-element')
  _opened = $navbar.hasClass('in')
  if _opened == true and !clickover.hasClass('dropdown-toggle')
    $navbar.collapse 'hide'
  return

在点击link_to t('.settings')时应关闭下拉菜单,但不起作用。

点击settings时如何关闭下拉列表?感谢您的帮助。

解决方案更新

如果有人需要这里是最终解决方案,这在我的案例中似乎是最简单的。我向$("#dialog").trigger('click');添加了users/edit.js.erb,当填充了模式时,后台中的下拉列表会消失。

1 个答案:

答案 0 :(得分:1)

导航栏选择器错误。应该是:

$navbar = $('.dropdown.profile-element')

或换句话说,你忘了&#34;。&#34;之前&#34; profile-element&#34;。