Question

嗨，我有一个无序列表：

<ul class="prodDetails">
<li class="details1"><a href="">Link1</a></li>
<li class="details2"><a href="">Link2</a></li>
<li class="details3"><a href="">Link3</a></li>
</ul>

$("ul.prodDetails li.details1 a").addClass('prodDetailsOn').siblings().removeClass('prodDetailsOn');

我正在尝试将类“prodDetailsOn”添加到单击的href，同时将其从所有其他href中删除。

我以某种方式错过了目标。有什么想法吗？

由于

Answer 1

您必须返回<li>元素才能获得其他LI。

$("ul.prodDetails li.details1 a").addClass('prodDetailsOn').parent('li').siblings().removeClass('prodDetailsOn');

Answer 2

这实际上是一种常见的模式。我所做的是首先删除切换，然后将其设置在触发事件的事物上。

$('.prodDetails a').click(function () {
    $('.prodDetails a.prodDetailsOn').removeClass('prodDetailsOn');
    $(this).addClass('prodDetailsOn');
});

Answer 3

$("ul li a").click(function() {
$("ul li a").removeClass("propDetailsOn");
$(this).addClass('propDetailsOn');
})

Answer 4

$(function(){
$("a").click(function(e){
e.preventDefault();
    $("a").not($(this)).removeClass("prodDetailsOn");
    $(this).addClass("prodDetailsOn");
});
});

这里是小提琴http://jsfiddle.net/3nigma/uF7M5/1/

针对兄弟姐妹的麻烦

4 个答案: