jquery - 选项卡不会更改为 “active” - jQuery 和 rails 3

Question

我有这个带有 2 个选项卡的导航菜单:

<div id="user_menu">
 <ul class="nav nav-tabs">
  <li class="active"><%= link_to "Group1", group1_friends_path(@user), :remote => true %></li>
  <li><%= link_to "Group2", group2_friends_path(@user), :remote => true %></li>
 </ul>
</div>

我已经设法让 Ajax 呈现某些部分。现在，当我单击选项卡时，部分加载到我的目标占位符 div 中。我构建了这个 jquery 脚本来处理这个问题，

tab.js: 我放在 assest/javascripts/中

$('#user_menu a').click(function (e) {
    $('ul.nav-tabs li.active').removeClass('active')
    $(this).parent('li').addClass('active')
})

我的 application.js 看起来像这样:

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .

如有任何帮助，我们将不胜感激。

Answer 1

试试这个。也许它在文档准备好之前就被执行了？

$(function() {
  $('#user_menu a').click(function (e) {
    $('ul.nav-tabs li.active').removeClass('active')
    $(this).parent('li').addClass('active')
  });
});