javascript - rails 5 : hide navigation drop-down on click

标签 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 中,这使得背景中的下拉菜单在模态时消失人口稠密。

最佳答案

您的导航栏选择器有误。应该是:

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

或者换句话说,你忘记了“.”在“配置文件元素”之前。

关于javascript - rails 5 : hide navigation drop-down on click,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42607467/

相关文章:

javascript - 如何在Qt WebKit中将网页保存为 "save as complete webpage"

jquery - Rails 3 : How do I call a javascript function from a js. erb 文件

javascript - 多个点击计数器,每个点击计数器都有唯一值

java - String数据类型从数据库到HTML页面的小数位限制

javascript - 处理 JavaScript 中的链接

javascript - 将所有字段加在一起或返回原始总和

javascript - 在 javascript 中禁用 anchor 标记并删除下划线

javascript - 使用 Javascript/JQuery 调整字体大小

javascript - YouTube API - 嵌入式 iframe 上的事件不起作用

jquery 使用变量分配和调用 ID