Deaktivieren Sie HTML button nach Klick um zu verhindern, doppelklicken Sie auf

Möchte ich zu verhindern Doppel-Klicks, so dass die Einstellung der disabled - Attribut auf die input element auf ein click-Ereignis scheint wie das richtige Ding zu tun. Und andere stackoverflow Antworten widerspiegeln. Also das ist, was ich geschrieben in CoffeeScript jQuery:

$('input[type="submit"]').on('click', ->
  $(this).addClass('disabled').attr('disabled', 'disabled')
  $(this).val('Sending')
)

Habe ich addClass('disabled') für die Stiftung.

In der Regel funktioniert dies. Wenn ich allerdings auf zurück klicken, ist die Schaltfläche noch deaktiviert ist. Wenn ich auf der Seite gehen und die Seite zwischengespeichert wurde, ist die Schaltfläche noch deaktiviert ist. Gibt es eine JavaScript-Bibliothek, die sich mit all diesen kleinen Probleme? Scheint, wie dies ist eine sehr häufige Notwendigkeit. Ist es nur ein wenig mehr JavaScript/jQuery muss ich hinzufügen, um die oben genannten?

Ich würde gedacht haben, dass HTML5 hätte einen Mechanismus für diese jetzt.

UPDATE: ich habe versucht, zu hören, für pageshow Veranstaltungen und un-disable submit-buttons:

$('input[type="submit"]').on('pageshow', function() {
  console.log('pageshowed')
  $(this).removeClass('disabled').removeAttr('disabled').val('Submit');
});

Nichts passiert, auch nicht, wenn die Seite zuerst geladen wird. Bin ich mit pageshow falsch?

  • Vielleicht können Sie verwenden quick-and-dirty workaround: aktivieren Sie Tasten auf dem Dokument.sind Sie bereit?
  • das funktioniert aber nicht. $(document).ready nicht erneut auszuführen, dessen handler auf, wenn die Seite gecacht wird oder zurück in den browser.
  • Danke für die explainig, das war einfach nur wild raten.
  • Dann versuchen Sie es pageshow
  • Ich werde versuchen, dass, aber sieht aus wie pageshow funktioniert nur für Firefox?
  • Funktioniert in Chrome sowie Firefox, nicht sicher über Safari oder IE (nicht auf Windows) funktioniert nicht mit Opera (aber funktioniert in Opera 15, da gleiche engine wie Chrome), versuchen typeof window.onpageshow in der Konsole
  • Ich aktualisierte die Frage konnte ich nicht hören, um das pageshow-event überhaupt, weder Firefox noch Chrome funktioniert.
  • pageshow ist ein Ereignis, auf das Fenster, nicht auf einem input element.
  • das funktionierte, ich hatte keine Zeit zu aktualisieren, die Frage vor. Stellen, dass als Antwort und ich gebe Ihnen Kredit für Sie. Ich hatte auch, um die Schaltfläche click-eigentlich ein form-submit-Ereignis, ansonsten Chrom würde nicht senden Sie das Formular.

InformationsquelleAutor at. | 2013-06-10
  1. 0

    Verwenden Sie die pageshow - Ereignis auf die window Objekt. Funktioniert in Chrome und Safari, sowie Firefox, nicht sicher, über IE funktioniert nicht in Opera 12 (aber funktioniert in Opera 15, da gleiche engine wie Chrome). Versuchen typeof window.onpageshow in der Konsole zu erkennen.

    InformationsquelleAutor robertc
  2. 0

    Ich benutze diese Methode:

    $(document).ready(function() {
  $('.auto-submit-disable')
    .submit(function () {
      $(this).find('button,input[type=submit]')
        .attr('disabled', 'true');
    });
});

if ($('.auto-submit-disable'))
  window.onunload = function(){}; //This forces re-execution of js

    Danach, einfach class="auto-submit-disable" auf Ihre Formulare. Beachten Sie, dass die Methode ist schwer zu Browsern, da wiederholen alle JS auf die zurück-navigation ist schwer.

    Also es ist nicht empfohlen, als eine Allgemeine Methode, um auf allen Ihren Seiten!!

    • Können nicht, können Sie noch ein Formular Absenden ohne button? Wie, über drücken der EINGABETASTE?
    • Nein, die meisten Browser akzeptieren keine <enter> wenn es kein aktives senden input.
    InformationsquelleAutor benjaoming
Schreibe einen Kommentar