JQuery-Klasse hinzugefügt bleibt nicht auf Änderung

Question

Ich kann einfach nicht herausfinden, ein Verhalten, ich bin kein JQuery-Guru und das gibt mir Kopfschmerzen. auf mein Dokument bereit ich habe

$('#Table').on('change', '#TeamValue', function (event) { 
     $(this).removeClass("valid"); 
     $(this).addClass("input-validation-error"); 
     var myClass = $(this).attr('class'); 
     console.log(myClass); 
    } 
}); 

In Konsole i die Klasse sehen also, änderte aber auf der Vorderseite ist es nicht. Warum passiert dies? Auch ich habe gesehen, dass, wenn ich den Inhalt lösche meine Eingangs-Validierungs-Fehler-Klasse gut erscheinen ... ich verstehe nur nicht. Kann mir jemand helfen?

Danke!

Eingang vor Klassenwechsel:

<input id='TeamValue' type='text' class='small-textbox'> 

Konsolenprotokoll:

text:a -.js:451:1 
wroing! -.js:456:13 
small-textbox input-validation-error 

HTML dieses Elements nach seiner Klasse geändert wurde:

<input id="TeamValue" onkeyup="Restriction()" class="small-textbox valid" type="text"> 

Answer 1

Der $(this) Kontext Sie beziehen sich auf ist wahrscheinlich das #Table Element und nicht die #TeamValue Element, das Sie erwarten. Meine Annahme ist, dass die Klassenänderungen stattdessen auf diesem Element stattfinden. Versuchen Sie, die Änderung Handler direkt an das #TeamValue Elementbefestigungs:

$('#TeamValue').on('change', function (event) { 
    $(this).removeClass("valid"); 
    $(this).addClass("input-validation-error"); 
    var myClass = $(this).attr('class'); 
    console.log(myClass); 
}); 

`` `