jQuery选择器

Question

我发现很难找到使用jQuery的例子，所以我不好意思问这样一个简单的问题。我有这个ul：

<ul id="navLinks"> 
    <li class="selected" id="homeNavLink"></li> 
    <li id="aboutNavLink"></li> 
    <li id="contactNavLink"></li> 
    ... 
</ul> 

我想写一个函数来改变哪个李有“选择”类。这是我的尝试：

function changeNavLink(selectedId) { 
    $("#navLinks li").each(function() { 
     $(this).removeClass("selected"); 
    }); 
    $("#" + selectedId).addClass("selected"); 
} 

我在做什么错？

Answer 1

你不必做.each - 功能，如removeClass可以在一组元素就好了工作。

function changeNavLink(selectedId) { 
    $("#navLinks li").removeClass('selected') 
        .filter('#' + selectedId) 
        .addClass('selected'); 
} 

应该工作。它正在做的是选择所有li元素，将selected中的selected全部从filtering them out中删除，并将selected添加到该元素中。

Here is a working link显示上面的代码在工作。

Answer 2

$('#navlinks li.selected') 

会给你立的“选择”类

Answer 3

对于给定的具体HTML例子，我宁愿：

function changeNavLink(selectedId) { 
    $('#' + selectedId).addClass('selected') 
         .siblings('li') 
         .removeClass('selected'); 
} 

Answer 4

为什么不使用jQuery（这）工作？它更容易，然后用params调用函数。 HTML：

<ul id="navLinks"> 
    <li class="selected" id="homeNavLink"></li> 
    <li id="aboutNavLink"></li> 
    <li id="contactNavLink"></li> 
</ul> 

JS：

$(document).ready(funciton(){ 
    $('#navLinkgs').on('click', 'li', function(){ 
    $this = $(this); 
    $('#navLinkgs li.selected').removeClass('selected'); 
    $this.addClass('selected'); 
    }); 
});