Question

是否有人知道如何使用jQuery each仅迭代前5个元素？

$(".kltat").each(function() {
   // Only do it for the first 5 elements of .kltat class
}

Answer 1

来自documentation：

我们可以通过使回调函数返回$.each()来打破特定迭代的false循环。

此外，相同的文档说明了您对.each的回调：

对于数组，每次都会向回调传递一个数组索引和相应的数组值。

所以尝试这样的事情：

$(".kltat").each(function(index, element) {
   // do something
   // ...
   return index < 4;
});

因此，在第五次执行循环后（index将等于4），循环将停止。请注意，需要使用此 n -1逻辑，因为在评估中断条件之前执行循环体。

＆＃13;

$(".kltat").each(function(index, element) {
  $(element).css('color', 'red');
  return index < 4;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="kltat">Item 1</li>
  <li class="kltat">Item 2</li>
  <li class="kltat">Item 3</li>
  <li class="kltat">Item 4</li>
  <li class="kltat">Item 5</li>
  <li class="kltat">Item 6</li>
  <li class="kltat">Item 7</li>
</ul>

＆＃13;

Answer 2

你可以实现这样的计数器：

var counter = 1;
$(".kltat").each(function() {
   // Only do it for the first 5 elements of .kltat class
   if (counter==5) {
     return false;
   } else {
     counter++;
   }
}

或类似的东西。

Answer 3

如何使用.filter()：

$(".kltat").filter(function (i) { return i < 5; })
.each(function () {
    // ...
});

Answer 4

$(".kltat").slice(0,5).each(function() {
   // Only do it for the first 5 elements of .kltat class
})

没有jquery：

[].slice.call(document.querySelectorAll('.kltat')).slice(0,5).forEach(function (element) {
    doStuff(element)
})

仅使用jQuery .each重复前5个元素

4 个答案: