Wie verwende ich jeden (Rückruf) von jquery?-js-Tutorial-php.cn

Wie verwende ich jeden (Rückruf) von jquery?

伊谢尔伦

Freigeben： 2017-06-16 15:58:48

Original

1344 Leute haben es durchsucht

Übersicht

Führen Sie eine Funktion mit jedem passenden Element als Kontext aus.

bedeutet, dass jedes Mal, wenn die übergebene Funktion ausgeführt wird, das Schlüsselwort this in der Funktion auf ein anderes DOM-Element verweist (jedes Mal ein anderes passendes Element). Darüber hinaus wird bei jeder Ausführung der Funktion ein numerischer Wert, der die Position des Elements als Ausführungsumgebung im passenden Elementsatz darstellt, als Parameter an die Funktion übergeben (eine auf Null basierende Ganzzahl). Die Rückgabe von „false“ stoppt die Schleife (genau wie die Verwendung von „break“ in einer normalen Schleife). Geben Sie „true“ zurück, um zur nächsten Schleife zu springen (genau wie die Verwendung von „continue“ in einer normalen Schleife).

Beispiele sind wie folgt:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
 <title> 遍历元素</title>
  <script src="js/jQuery.js" type="text/JavaScript"></script>
    <!-- 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
     -->
 <style type="text/css">
  body{font-size:13px}
  img{border:solid 1px #ccc;padding:3px;margin:5px;width:143px;height:101px}
 </style>
 <script type="text/javascript">
  $(function() {
   $("img").each(function(index){
    // 根据形参index 设置元素的title 属性
    this.title = " 第" + index +" 幅风景图片，alt 内容是" + this.alt;
    if(i==1)
     return false;
   })
  })
 </script>
  </head>
  <body>
 <p>
  <img title="picture0" src="images/img05.jpg" alt=" 第0 幅风景画" />
  <img title="picture1" src="images/img06.jpg" alt=" 第1 幅风景画" />
  <img title="picture2" src="images/img07.jpg" alt=" 第2 幅风景画" />
 </p>
  </body>
</html>

Nach dem Login kopieren

Allgemeine Iterationsmethode, die zum Iterieren von Objekten und Arrays verwendet werden kann.

Im Gegensatz zur Methode $().each(), die über jQuery-Objekte iteriert, kann diese Methode zum Iterieren über jedes beliebige Objekt verwendet werden. Die Rückruffunktion hat zwei Parameter: Der erste ist das Mitglied des Objekts oder der Index des Arrays und der zweite ist die entsprechende Variable oder der entsprechende Inhalt. Wenn Sie die Each-Schleife verlassen müssen, können Sie dafür sorgen, dass die Rückruffunktion „false“ zurückgibt und andere Rückgabewerte ignoriert werden.

var dic={"tom" : 20,"jerry" :30, "jim":40};
$.each(dic,function(key,value){ alert(key+"的年龄是"+value); });

Nach dem Login kopieren

Ergebnis: Tom ist 20 Jahre alt
Jerry ist 30 Jahre alt

Jim ist 40 Jahre alt

var arr=[1,2,3];
$.each(arr,function(key,value){ key++;alert(key+"="+value);});

Nach dem Login kopieren

Ergebnis: 1 =1 2=2 3=3

var arr=[1,2,3];
$.each(arr,function(item){ alert(item);});

Nach dem Login kopieren

Ergebnis: 0 1 2

var dic={"tom" : 20,"jerry" :30, "jim":40};
$.each(dic,function(){ alert(this);});

Nach dem Login kopieren

Ergebnis: 20 30 40

$ .each( ) unterscheidet sich von $(selector).each(). Letzteres wird speziell zum Durchlaufen von JQuery-Objekten verwendet. Ersteres kann zum Durchlaufen jeder Sammlung verwendet werden (ob es sich um ein Array handelt). Die Rückruffunktion übergibt jedes Mal den Index und den entsprechenden Wert (der Wert kann auch über das Schlüsselwort this abgerufen werden, aber JavaScript umschließt diesen Wert immer als Objekt – auch wenn es sich um eine Zeichenfolge oder eine Zahl handelt). gibt das durchquerte Objekt zurückDer erste Parameter.

each()-Methode kann die DOM-Schleifenstruktur prägnant und weniger fehleranfällig machen. Die Funktion every() kapselt eine sehr leistungsstarke Traversierungsfunktion und ist sehr praktisch zu verwenden. Sie kann

eindimensionale Arrays , mehrdimensionale Arrays , DOM, JSON usw. durchlaufen 🎜> entwickelt in JavaScript. Die Verwendung von $each während des Prozesses kann unseren Arbeitsaufwand erheblich reduzieren.
jeder verarbeitet ein eindimensionales Array

alert(i) gibt 0, 1, 2 aus

var arr1 = [ "aaa", "bbb", "ccc" ];
$.each(arr1, function(i,val){
alert(i);
alert(val);
});

Nach dem Login kopieren

alert(val) gibt aaa, bbb, ccc aus

jeder behandelt

zweidimensionales Array

arr2 ist ein zweidimensionales Array, und item entspricht der Übernahme jedes Arrays in diesem zweidimensionalen Array.

var arr2 = [[&#39;a&#39;, &#39;aa&#39;, &#39;aaa&#39;], [&#39;b&#39;, &#39;bb&#39;, &#39;bbb&#39;], [&#39;c&#39;, &#39;cc&#39;, &#39;ccc&#39;]]
　　$.each(arr, function(i, item){
alert(i);
alert(item);
　　});

Nach dem Login kopieren

item[0] relativ zur Annahme des ersten Werts in jedem eindimensionalen Array

alert(i) gibt 0, 1, 2 aus, da dieses zweidimensionale Array 3 Array-Elemente enthält
alert(item ) wird als ['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']
<🎜 ausgegeben >Nach einer geringfügigen Änderung der Verarbeitung dieses zweistelligen Arrays

alert(j) gibt 0, 1, 2, 0, 1, 2, 0, 1, 2

var arr = [[&#39;a&#39;, &#39;aa&#39;, &#39;aaa&#39;], [&#39;b&#39;, &#39;bb&#39;, &#39;bbb&#39;], [&#39;c&#39;, &#39;cc&#39;, &#39;ccc&#39;]]
　　$.each(arr, function(i, item){
　　$.each(item,function(j,val){
　　　　 alert(j);
　　　　alert(val);
　});
});

Nach dem Login kopieren

aus alarm(val) gibt a, aa, aaa, b, bb, bbb, c, cc, ccc aus

jeder verarbeitet JSON-Daten, dieser ist noch leistungsfähiger, er kann jedes An-Attribut schleifen

Hier gibt alarm(key) eins zwei drei aus

alert(val) gibt eins, 1, zwei, 2, drei, 3 aus

var obj = { one:1, two:2, three:3};
each(obj, function(key, val) {
alert(key);
alert(val);
});

Nach dem Login kopieren

Warum ist der Schlüssel hier keine Zahl? Attribute, weil das JSON-Format eine Menge ungeordneter Attributwerte ist. Da es ungeordnet ist, wo sind die Zahlen?

Und dieser Wert entspricht obj[key]

ecah verarbeitet dom-Elemente. Hier wird ein Eingabeformularelement als Beispiel verwendet.

Wenn Sie einen Code wie diesen in Ihrem Dom haben

und ihn dann wie folgt verwenden

<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444"/>

Nach dem Login kopieren

, dann wird „alert(val)“ ausgegeben [object HTMLInputElement] , da es sich um ein Formularelement handelt.

$.each($("input:hidden"), function(i,val){
alert(val);
alert(i);
alert(val.name);
alert(val.value);
});

Nach dem Login kopieren

alert(i) gibt 0, 1, 2, 3 aus

alert(val.name); gibt aaa, bbb, ccc, ddd aus, wenn Sie this.name verwenden, wird es ausgegeben Ausgabe Das gleiche Ergebnis

alert(val.value); gibt 111.222.333.444 aus. Wenn Sie this.value verwenden, wird das gleiche Ergebnis ausgegeben

Wenn Sie den obigen Code in die folgende Form ändern

Wie Sie sehen, sind die Ausgabeergebnisse die gleichen. Was den Unterschied zwischen den beiden Schreibmethoden betrifft, weiß ich noch nicht. Diese Änderung führt zu denselben Ergebnissen, wenn sie auf die oben genannten Array-Operationen angewendet wird.

Das obige ist der detaillierte Inhalt vonWie verwende ich jeden (Rückruf) von jquery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!