0

我需要突出显示与当前页面相关的链接按钮。

在apps/views/layouts/application.html.erb：

<ul class="nav nav-tabs">
    <li class="link_style"><a href="/">link1</a></li>
    <li class="link_style"><a href="/about">link2</a></li>
    <li class="link_style"><a href="/posts">link3</a></li>
</ul>

我打算将以下内容添加到某个.js文件中

$('li.link_style').on('click', function(){
    $(this).addClass('active'); // and then add active class for clicked element.
});​

我认为这会很好。但是，我不确定应该在哪个 .js 文件中添加 js 代码。我的猜测/app/views/layouts/application.js.erb 是我的方法对吗？

4

2 回答 2

2

指某东西的用途

$('li.link_style').on('click', function(){
   $(this).addClass('active'); // and then add active class for clicked element.
});​

但是不起作用，因为单击链接时将重新加载页面（和 JS）。更有用的东西可能是这样的：

$(document).ready(function() {
  $(".nav li.link_style").each(function(){
    var link = $(this).find($(a));
    if(window.location.pathname == link.attr("href")){
      link.addClass("active");
    }
  });
});

这将遍历 nav 类中的所有 li 元素，并将当前页面的路径与链接的 href 进行比较，如果它们匹配，则添加 active 类。您应该在 JS 文件的 $(document).ready(function() {} 部分中放置类似的内容。至于将其添加到哪个 JS 文件中，它可以是 Asset Pipeline (Rails 3.1) 中包含的任何内容+) 或您所说的 application.js。

于 2012-12-07T03:17:09.780 回答
0

如果您使用 Rails 3.1 或更高版本应用程序的默认设置，您可以将其.js放在app/assets/javascripts. 请务必查看Rails 资产管道指南中的资产组织部分

于 2012-12-07T02:45:17.177 回答