jQuery 中 addClass 的问题

Question

我在 jQuery 中的选择器方面遇到问题。或者（我不这么认为）使用我的 jQuery 代码。

我来说说我的问题吧。 我有一个 Rails 项目，并且我想在菜单中插入一个“active”类（如果当前页面与菜单中的页面相同）。

例如：

当前页面：帖子 我的菜单：

• 页面（类：无）
• 用户（类：无）
• 帖子（类：“活动”）
• Blablabla ...

我的 HTML/Rails/jQuery 代码（如果您是 Rails 开发人员，这是我的布局）：

菜单：

<ul id="nav">
  <li id="dashboard"><%= link_to "Dashboard", admin_index_path %></li>
  <li id="notes"><%= link_to "Notes", admin_notes_path %>
   <ul>
    <li><a href="#">List notes</a></li>
    <li><a href="#">Add note</a></li>
   </ul>
  </li>
  <li id="projects"><a href="#">Projects</a>
   <ul>
    <li><a href="#">List projects</a></li>
    <li><a href="#">Add project</a></li>
   </ul>
  </li>
  <li id="users"><a href="#">Users</a></li>
</ul>

脚本：

<script>
 $("#hld #wrapper #header #nav li").addClass(function() {
   var addedClass;

   if ($(this).attr('id') === "<%= content_for(:title).downcase %>") {
    return "active";
   }

   return addedClass;
 });
</script>

<!--[if IE]><script type="text/javascript" src="/assets/excanvas.js"></script><![endif]-->  
<script type="text/javascript" src="/assets/jquery.js"></script>
<script type="text/javascript" src="/assets/jquery.img.preload.js"></script>
<script type="text/javascript" src="/assets/jquery.filestyle.mini.js"></script>
<script type="text/javascript" src="/assets/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="/assets/jquery.date_input.pack.js"></script>
<script type="text/javascript" src="/assets/facebox.js"></script>
<script type="text/javascript" src="/assets/jquery.visualize.js"></script>
<script type="text/javascript" src="/assets/jquery.visualize.tooltip.js"></script>
<script type="text/javascript" src="/assets/jquery.select_skin.js"></script>
<script type="text/javascript" src="/assets/jquery.tablesorter.min.js"></script>
<script type="text/javascript" src="/assets/ajaxupload.js"></script>
<script type="text/javascript" src="/assets/jquery.pngfix.js"></script>
<script type="text/javascript" src="/assets/custom.js"></script>

寻找脚本，当然会有我的 jQuery 脚本。 那么，问题出在哪里呢？

感谢您的帮助，我试图说清楚。 卢卡斯·莫雷拉.

Answer 1

正如 Jfriend00 所指出的，你的选择器不必要太长。 '#nav li' 就足够了。
更好的是，因为您只是（大概）寻找 #nav 的直接子级，所以使用 '#nav > li'。

另外（如果我错了，请有人纠正我）但我认为您的脚本应该位于加载外部脚本的位置下方。在加载 JQuery 之前尝试使用它可能会导致问题;-)