jQuery中的addClass问题

Question

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

让我说说我的问题。 我有一个Rails项目，我想在菜单中插入“活动”类（如果菜单中当前页面相同）。

例如：

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

• 页数（类别：无）
• 用户（类别：无）
• 帖子（类别：“活动”）
• 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中当然会有我的脚本。 所以有什么问题？

感谢您的帮助，我试图弄清楚。 卢卡斯·莫雷拉（Lucas Moreira）。

Answer 1

正如Jfriend00所指出的，您的选择器过长。 '#nav li'就足够了。
更好的是，因为您仅（大概）正在寻找#nav的直接子代，请使用'#nav > li' 。

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