jQuery - 跳出each函数循环（跳过本次循环、跳出所有循环）

2017-12-28 发布：hangge 阅读：9758

我们知道在 JavaScript 的 for 循环中，可以使用 continue 语句跳过本次循环，使用 break 语句跳出（结束）整个循环。而 jQuery 除了for 循环外，还有个 each() 方法也可以用来遍历元素，不过在该方法中不是通过 continue 或 break 来跳过循环，而是使用 return 语句实现类似的功能。

1，跳出 each() 循环的语句

return true：跳过本次循环（类似 for 循环的 continue）
return false：跳出所有循环（类似 for 循环的 break）

2，使用样例

（1）假设我们页面上有 5 个 li 元素。

<ul>
  <li>条目1</li>
  <li>条目2</li>
  <li>条目3</li>
  <li>条目4</li>
  <li>条目5</li>
</ul>

（2）将奇数行的 li 文字改成橙色。

var i = 0;
$('li').each(function(){
  i++;
  //如果是偶数行，则跳过本次循环
  if(i % 2 == 0) {
    return true;
  }
  $(this).css("color","orange");
});

（3）将前 3 行的 li 文字改成橙色。

var i = 0;
$('li').each(function(){
  i++;
  //如果超过第3行，则直接结束所有循环
  if(i > 3) {
    return false;
  }
  $(this).css("color","orange");
});