jQuery.each()

jQuery.each( collection, callback(indexInArray, valueOfElement) )

תיאור: פונקציה גינרית, אשר ניתן להשתמש בה עבור דפדוף גם אובייקטים וגם מערכים. מערכים ואובייקטים של מערכים עם מאפיין אורך (לדוגמה, ארגומנטים של פונקציה של אובייקט), הם מדופדפים לפי אינדקס מספרי, מ-0 עד אורך פחות 1. אובייקטים אחרים מדופדפים באמצעות תכונות שלהם בשם.

jQuery.each( collection, callback(indexInArray, valueOfElement) )

הוספה בגרסה: 1.0

collection

אובייקט, מערך

אובייקט או מערך לדפדף עליהם.

callback(indexInArray, valueOfElement)

פונקציה

פונקציה שתופעל על כל אובביק.

פונקציה $.each() דומה ל- .each(), שמשמשת עבור דפדוף, אך ורק של אובייקטים jQuery. פונקציה $.each() יכולה להשתמש עבור דפדוף של כל אוסף, אם זאת מפה (אובייקט JavaScript) או מערך. במקרה אם זה מערך, פונקציה של קריאה חוזרת שולחת אינדקס של מערך וערך של מערך כל פעם. (ערך גם ניתן לקבל באמצעות מילת מפתח this, אבל Javascript תמיד עוטף ערך this כמו אובייקט אפילו אם זו מחרוזת פשוטה או ערך מספרי .) שיטה מחזירה ארגומנט ראשון, אובייקט, שתואם לדפדוף נוכחי.

$.each([52, 97], function(index, value) { 
  alert(index + ': ' + value); 
});

התוצאה היא שתי הודעות:

0: 52
1: 97

אם משמשת מפה, פונקציה של קריאה חוזרת כל פעם שולחת זוג מפתח-ערך:

var map = { 
  'flammable': 'inflammable', 
  'duh': 'no duh' 
}; 
$.each(map, function(key, value) { 
  alert(key + ': ' + value); 
});

שוב פעם התוצאה היא שתי הודעות:

flammable: inflammable
duh: no duh

אנחנו יכולים לעצור דיפדוף $.each() בשלב מסוים באמצעות החזרת דרך פונקציה של קריאה חוזרת false. החזרת ערך כלשהו שהוא לא false זה כמו ביטוי continue בלולאה for; הוא מייד עובר לדפדוף הבאה.

דוגמאות

דוגמה 1

עובר על כל פריט במערך ומציג מספר שלו גם על ידי ספרה וגם על ידי מילה

    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));
    });

תוצאת הפעלה קוד לעיל:

נסה זאת בעצמך

דוגמה 1- קוד מלא:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>  
  <script type="text/javascript" language="javascript">
  $(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>

נסה זאת בעצמך

דוגמה 2

עובר על כל אלמנט של מערך ומקבל גישה גם לאלמנט עצמו וגם לאינדקס שלו

$.each( [0,1,2], function(i, n){
  alert( "Item #" + i + ": " + n );
});

דוגמה 3

מטפל בכל תכונה של אובייקט ומקבל גישה לאלמנט עצמו וגם לערך שלו

$.each( { name: "John", lang: "JS" }, function(i, n){
  alert( "Name: " + i + ", Value: " + n );
});

האם מידע זה היה מועיל?

כן לא

jQuery.each()

jQuery.each( collection, callback(indexInArray, valueOfElement) )

jQuery.each( collection, callback(indexInArray, valueOfElement) )

דוגמאות

דוגמה 1

דוגמה 1- קוד מלא:

דוגמה 2

דוגמה 3

תגובות