Löschen Sie alle Felder in einem Formular, wenn Sie mit der Zurück-Schaltfläche des Browsers zurückkehren

Ich brauche einen Weg, um alle Felder zu löschen in einem Formular, wenn ein Benutzer verwendet den browser-zurück-Taste. Jetzt, merkt sich der browser die letzten Werte und zeigt Sie an, wenn Sie wieder gehen.

Mehr Klarheit, warum brauche ich das
Ich habe ein deaktiviertes input-Feld, dessen Wert automatisch generiert wird, unter Verwendung eines Algorithmus, um die es einzigartig machen-innerhalb einer bestimmten Gruppe von Daten. Einmal habe ich den Antrag eingereicht und die Daten in die Datenbank eingegeben werden, sollte der Anwender nicht in der Lage sein, um den gleichen Wert wieder zu senden die gleiche form. Daher habe ich deaktiviert das Eingabefeld in den ersten Platz. Aber wenn der Benutzer die zurück-Schaltfläche Ihres Browsers, der browser merkt sich den letzten Wert und den gleichen Wert beibehalten wird, in das Eingabefeld ein. Daher kann der Benutzer das Formular abschicken mit dem gleichen Wert wieder.

Was ich nicht verstehe ist, was genau passiert, wenn Sie drücken Sie die zurück-Schaltfläche Ihres Browsers. Es scheinen, wie die gesamte Seite wird aus dem cache abgerufen, ohne jemals den server zu Kontaktieren, wenn die Größe der Seite in den browser-cache begrenzen. Wie Stelle ich sicher, dass die Seite geladen ist vom server unabhängig von der browser-Einstellung, wenn Sie drücken Sie die zurück-Schaltfläche Ihres Browsers?

InformationsquelleAutor der Frage Prabin Pebam | 2012-01-14

  1. 49

    Modernen Browsern etwas umzusetzen, bekannt als back-forward-cache (BFCache). Wenn Sie drücken Sie vorwärts/zurück-Knopf die Seite nicht neu geladen (und die scripts sind nie re-run).

    Wenn Sie haben, etwas zu tun im Falle dass der user schlagen zurück/vorwärts-Tasten-hören für BFCache pageshow und pagehide Veranstaltungen.

    Pseudo jQuery Beispiel:

    $(window).bind("pageshow", function() {
  //update hidden input field
});

    Sehen Sie mehr details für Gecko und WebKit Implementierungen.

    InformationsquelleAutor der Antwort Sim

  2. 31

    Andere Möglichkeit ohne JavaScript ist die Verwendung <form autocomplete="off"> zu verhindern, dass der browser von re-füllen Sie das Formular mit den letzten Werten.

    Siehe auch diese Frage

    Getestet, die nur mit einem einzigen <input type="text"> in die form, funktioniert aber in der aktuellen Chrome-und Firefox, leider nicht im IE10.

    InformationsquelleAutor der Antwort Michael Sandino

  3. 20

    Stieß ich auf diesen Beitrag bei der Suche nach einem Weg, um löschen Sie die gesamte form im Zusammenhang mit der BFCache (vorwärts/zurück-button-cache) in Chrom.

    Zusätzlich zu dem, was Sim geliefert, mein Anwendungsfall erforderlich, dass die Informationen, die benötigt werden, kombiniert mit Klare Form auf die Zurück-Taste?.

    Fand ich, dass der beste Weg, dies zu tun ist, in ermöglichen, die form zu Verhalten, wie es erwartet wird, und ein Ereignis auslösen:

    $(window).bind("pageshow", function() {
    var form = $('form'); 
    //let the browser natively reset defaults
    form[0].reset();
});

    Wenn Sie nicht sind, handling der input Veranstaltungen erzeugen Sie ein Objekt in JavaScript, oder etwas anderes für diese Angelegenheit, dann sind Sie fertig. Wenn Sie jedoch hören sich die Ereignisse, dann zumindest in Chrome müssen Sie die trigger eine change Veranstaltung selbst (oder was auch immer Fall, den Sie behandeln, einschließlich einer benutzerdefinierten):

    form.find(':input').not(':button,:submit,:reset,:hidden').trigger('change');

    Die Hinzugefügt werden müssen nach die reset um etwas gutes zu tun.

    InformationsquelleAutor der Antwort pickypg

  4. 8

    Wenn Sie brauchen, um kompatibel mit älteren Browsern auch "pageshow" option funktioniert möglicherweise nicht. Folgender code funktionierte für mich. 

    $(window).load(function() {
    $('form').get(0).reset(); //clear form data on page load
});

    InformationsquelleAutor der Antwort Asanka Siriwardena

  5. 4

    Dies ist was für mich gearbeitet.

    <script>
$(window).bind("pageshow", function() {
    $("#id").val('');
    $("#another_id").val('');
});
</script>

    Ich hatte anfangs auch diese in das $(document).bereit Abschnitt meiner jquery, die auch arbeiteten. Allerdings habe ich gehört, dass nicht alle Browser fire $(document).bereit schlagen zurück-button, also nahm ich es heraus. Ich weiß nicht, die vor-und Nachteile dieses Ansatzes, aber ich habe getestet auf mehreren Browsern auf mehreren Geräten, und keine Probleme mit dieser Lösung, die gefunden wurden.

    InformationsquelleAutor der Antwort Randy Greencorn

  6. 3

    Unten links könnten dir helfen..

    Browser zurück-button wieder her leere Felder
    Klare Form auf die Zurück-Taste?

    Hoffe das hilft... viel Glück

    InformationsquelleAutor der Antwort Fahim Parkar

Schreibe einen Kommentar