jQuery.each

« Обратно к странице инструментов

[редактировать]

jQuery.each( объект, вызов )

Общая функция для построения циклов, которую можно использовать для итераций над объектами и массивами. Массивы и массиво-подобные объекты, обладающие свойством длины, обрабатываются по индексу, от 0 до length-1. Остальные объекты — по именованным свойствам.
Данная функция НЕ то же самое, что и $().each(), которая обрабатывает исключительно объекты jQuery. Представленная здесь функция может обрабатывать что угодно.
Функция, вызывающаяся во втором аргументе, имеет свои два аргумента: ключ (для объектов) или индекс (для массивов) в качестве первого и значение в качестве второго.
Если Вам необходимо остановить цикл each() на конкретной итерации, то нужно лишь заставить Вашу функцию возвратить false, в противном случае, цикл продолжится.
Аргументы:

объект Объект
Исходный объект или массив.
вызов Функция
Функция, которая будет выполнена для каждого объекта.

function callback(indexInArray, valueOfElement) {
  var booleanKeepGoing;

  this; // == valueOfElement (casted to Object)

  return booleanKeepGoing; // optional, unless false
                           // and want to stop looping
}
Примеры:

Обрабатывает каждый элемент массива показывая его номер (как числом так и словом).
    var arr = [ "one", "two", "three", "four", "five" ];
    var obj = { one:1, two:2, three:3, four:4, five:5 };

    jQuery.each(arr, function() {
      $("#" + this).text("My id is " + this + ".");
      return (this != "four"); // will stop running to skip "five"

    });

    jQuery.each(obj, function(i, val) {
      $("#" + i).append(document.createTextNode(" - " + val));
    });
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
  $(document).ready(function(){

    var arr = [ "one", "two", "three", "four", "five" ];
    var obj = { one:1, two:2, three:3, four:4, five:5 };

    jQuery.each(arr, function() {
      $("#" + this).text("My id is " + this + ".");
      return (this != "four"); // will stop running to skip "five"

    });

    jQuery.each(obj, function(i, val) {
      $("#" + i).append(document.createTextNode(" - " + val));
    });

  });
  </script>
  <style>

  div { color:blue; }
  div#five { color:red; }
  </style>
</head>
<body>
  <div id="one"></div>
  <div id="two"></div>

  <div id="three"></div>
  <div id="four"></div>
  <div id="five"></div>
</body>

</html>
Обрабатывает каждый элемент массива получая доступ как к текущему элементу, так и к его индексу.
$.each( [0,1,2], function(i, n){
  alert( "Item #" + i + ": " + n );
});
Обрабатывает каждое свойство объекта получая доступ как к текущему элементу, так и к его значению.
$.each( { name: "John", lang: "JS" }, function(i, n){
  alert( "Name: " + i + ", Value: " + n );
});
Name Type