Question

我想做这件事很简单。

我必须将当前类添加到第一个<li>元素，将禁用类添加到其他元素。目前我这样做：

$('#slideshow li:first').addClass('current');

$('#slideshow li').not(':first').addClass('disabled');

但是我想知道我们是否可以在一行中做这样的事情：

$('#slideshow li').not(':first', function(){ $(this).addClass('current'); }).addClass('disabled');

任何启示都会受到高度赞赏。：）

Answer 1

jQuery链接有效，因为调用的方法返回的是运行它的相同或修改的结果集。因此，通过使用not()进行过滤，您将返回修改后的结果集，并且无法再次访问原始结果集。

您可以使用.end()解决此问题，其中执行以下操作：

End the most recent filtering operation in the current chain and return the set of matched elements to its previous state.

所以你要么做一些像你一样的事情（但是要缓存结果集），我发现它有点混乱，而且更具可读性：

var elements = $('#slideshow li');
elements.first().addClass('current');
elements.not(':first').addClass('disabled');

或者你使用end()在一行中完成，这可能会变成一长串代码：

$('#slideshow li').first().addClass('current').end().not(':first').addClass('disabled');

Answer 2

我最好能在清晨做到......

$('#slideshow li').first().addClass('current').end().not(':first').addClass('disabled');

Answer 3

你可以说：

$('#slideshow li').addClass(function(i) { return !i ? "current" : "disabled"; });

i是0索引的，是您选择元素的位置的索引。

所以如果i == 0与第一个元素相同

i == 0 == false == !true。

所以：

!i == !0 == !false == true。

然后我们可以回复：

return !i ? "current" : "disabled"。

意思是：

if ( !i ) {
    return "current";
}
else {
    return "disabled";
}

Answer 4

我的建议是：不要用一行来做。将其拆分为两行并缓存选择器的结果：

var items = $('#slideshow li');
items.first().addClass('current');
items.not(':first').addClass('disabled')

Answer 5

您可以使用siblings()方法：

$("#slideshow li:first").addClass("current").siblings().addClass("disabled");

为什么我没想到这个？???