Wie aktiviere/deaktiviere ich eine jQuery-Senden-Schaltfläche basierend auf der Textfeldeingabe?

Deaktivieren und Aktivieren einer jQuery-Senden-Schaltfläche basierend auf der Textfeldeingabe

In einem Szenario, in dem Sie eine Senden-Schaltfläche benötigen, die inaktiv ist, wenn das entsprechende Textfeld leer ist und wird aktiv ist, sobald Text eingegeben wurde, bieten die folgenden Schritte eine robuste Lösung:

1. Schaltfläche „Senden“ zunächst deaktivieren:

   $(document).ready(function() {
       $(':input[type="submit"]').prop('disabled', true);
   });

2. Textfeldänderungen mithilfe des Keyup-Ereignisses überwachen:

   $('input[type="text"]').keyup(function() {
       // Check if the text field is not empty
       if($(this).val() != '') {
           // Enable the submit button
           $(':input[type="submit"]').prop('disabled', false);
       } else {
           // Disable the submit button
           $(':input[type="submit"]').prop('disabled', true);
       }
   });

3. Änderungsereignis vermeiden (optional):
   Das Änderungsereignis wird ausgelöst, wenn Der Fokus wird vom Eingabefeld wegbewegt, was in diesem Szenario möglicherweise nicht das gewünschte Verhalten ist. Durch die Verwendung von „keyup“ wird stattdessen sichergestellt, dass die Schaltfläche auf den Eingabewert reagiert, sobald eine Taste losgelassen wird, auch wenn der Fokus weiterhin auf dem Feld liegt.

Das obige ist der detaillierte Inhalt vonWie aktiviere/deaktiviere ich eine jQuery-Senden-Schaltfläche basierend auf der Textfeldeingabe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!