jQuery .each Funktion Hilfe

Question

Ich habe mich gefragt, was ich hier falsch gemacht habe. Die erste Funktion läuft gut, wenn die Reset-Taste aufgerufen wird, aber aus irgendeinem Grund tut die zweite Funktion nichts. Das Formular wird zwar zurückgesetzt, aber die zweite Warnung wird nie angezeigt und die Warn-Klasse wird nie entfernt. Danke für Ihre Hilfe!

$('#registration :reset').click(function() { 
    alert("reset was clicked"); 
    $('#registration :text').each(function() { 
     if ($(this).hasclass('warn')) { 
      $(this).removeClass('warn'); 
     } 

     if (!$(this).hasclass('texta')) { 
      $(this).addClass('texta'); 
     } 

     alert("value"); 
    }); 
}); 

Answer 1

Die Javascript Sprache case-sensitive ist. Die hasclass() Methode existiert nicht, aber hasClass() tut. Sie sollten schreiben:

$('#registration :text').each(function() { 
    if ($(this).hasClass('warn')) { 
     $(this).removeClass('warn'); 
    } 

    if (!$(this).hasClass('texta')) { 
     $(this).addClass('texta'); 
    } 

    alert("value"); 
}); 

Das heißt, Sie müssen in der Regel nicht hasClass() vor addClass() oder removeClass() nennen, weil addClass() nicht ein Duplikat hinzufügen, wenn das Element bereits die Klasse hat Sie angeben, und removeClass() won‘ t entferne eine Klasse, die das Element nicht hat. So können Sie einfach schreiben:

$('#registration :text').each(function() { 
    $(this).removeClass('warn'); 
    $(this).addClass('texta'); 
    alert("value"); 
}); 

Oder-Methode verketten wie @deceze tut:

$('#registration :text').each(function() { 
    $(this).removeClass('warn').addClass('texta'); 
    alert("value"); 
}); 

Answer 2

Versuchen Live zu verwenden, wie sie hinzugefügt und entfernt werden immer,

ich denke, wenn Sie entfernen sie un binded bekommen ..

$('#registration :reset').live('click', function() { 
    alert("reset was clicked"); 
    $('#registration :text').each(function() { 
     if ($(this).hasClass('warn')) { 
      $(this).removeClass('warn'); 
     } 

     if (!$(this).hasClass('texta')) { 
      $(this).addClass('texta'); 
     } 

     alert("value"); 
    }); 
}); 

Answer 3

Versuchen Sie stattdessen:

$('#registration :text').removeClass('warn').addClass('texta'); 

---

Siehe ze Magik von jQuery!

So ziemlich jede jQuery-Methode funktioniert auf jedes Element, das von der $-Funktion zurückgegeben wird. Es müssen also nicht alle Ergebnisse durchlaufen werden. removeClass und addClass werden auf alle Elemente angewendet, die vom Selektor #registration :text gefunden werden. Darüber hinaus müssen Sie vor dem Entfernen oder Hinzufügen von Klassen keine Prüfungen durchführen. Wenn Sie die Klasse hinzufügen und das Element bereits über die Klasse verfügt, passiert nichts. Umgekehrt zum Entfernen einer Klasse.

Versuchen Sie zu lesen a tutorial, das macht jQuery so mächtig!