web-dev-qa-db-de.com

HTML - Eingabewert bleibt nach Refresh erhalten

Normalerweise werden bei einer Aktualisierung auf einer HTML-Seite die Werte für Eingabefelder beibehalten (sofern Sie nicht Strg + F5 verwenden).

Gibt es eine Kopfzeile oder eine andere Art von Einstellung, die dieses Verhalten ändern kann, ohne irgendetwas auf dem Formular oder der Eingabe selbst zu ändern?

Ich habe eine Site, auf der der Eingabewert nach einer Seitenaktualisierung in Production nicht beibehalten wird. Ich habe dieses Verhalten jedoch nicht, wenn ich diesen Code auf meinem lokalen Computer teste.

20
JB Hurteaux

Wenn Sie das Attribut autocomplete=off setzen, wird der Inhalt niemals gespeichert.

Alternativ gibt es eine Vielzahl von Möglichkeiten, dies mit Javascript zu erreichen, abhängig davon, was genau Sie erreichen möchten, sei es, ob Sie das gesamte Formular löschen (verwenden Sie die reset () -Methode) oder das einzelne Feld zurücksetzen.

61
McPherrinM

Sie können form.reset () zum body onload hinzufügen:

<html>
    <body onload="form1.reset();">
        <form id="form1">
            <textarea id="text"></textarea>
        </form>
    </body>
</html>

Update: Obwohl dies eine nützliche Technik sein kann, habe ich jetzt herausgefunden, dass sie die Frage des Einreichers nicht wirklich beantwortet.

7
Mark Byers

Wie wäre es, wenn Sie einen Standardwert für DOM mit Javascript festlegen?

So etwas wie

<input name="foo" id="foo" type="text">

$('#foo').val('3')
1
hex

Soweit ich weiß, gibt es keine Standardmethode für die Implementierung. Bevor Sie sie deaktivieren können, müssen Sie zunächst feststellen, wie die Site dies tut. Es gibt viele Möglichkeiten, wie sie es hätten tun können, wie Sie an den verschiedenen Antworten sehen können.

Ein guter Weg, um zu verstehen, was passiert, ist, den Code auf ein möglichst einfaches Beispiel zu reduzieren, das das Problem noch immer reproduziert. Entfernen Sie alle Grafiken, nicht benötigten Text, Stylesheets und andere Formatierungen, irrelevantes Javascript, irrelevante HTML-Tags usw. Stellen Sie jedoch immer sicher, dass Sie das Problem weiterhin reproduzieren können. Schließlich wird so wenig Code übrig bleiben, dass es offensichtlich sein sollte, was die Felder zurücksetzt. Sie müssen dies alles auf der Produktionsmaschine tun, da Sie es nicht lokal reproduzieren können. Nehmen Sie dazu eine Kopie der Skripte und benennen Sie sie in index2.html usw. um. Stellen Sie sicher, dass Sie über Sicherungen Ihres Produktionssystems verfügen, falls etwas schief geht.

Wenn Sie immer noch nicht verstehen, wie Sie das Problem beheben können, sollte der Code so klein sein, dass er hier veröffentlicht werden kann, und eine andere Person kann das Problem lösen.

1
Mark Byers

Sie können den Wert der Eingabe wie folgt auf eine leere Zeichenfolge zurücksetzen:

HTML Quelltext:

<form>
    <input type="email" id="input-value" placeholder="Type your email..." required>
    <button type="submit">Submit</button>
</form>

JS-Code:

window.onload = function() {
  document.getElementById('input-value').value = '';
}

Bei jeder Aktualisierung der Seite wird der Eingabewert bereinigt. Ich hoffe das hilft!

0
Manuel Abascal

Ich benutze das normalerweise:

var reset_input_values = document.querySelectorAll('input');
for (var i = 0; i < reset_input_values.length; i++) {
  reset_input_values[i].value = 'value you want ';
}
0
Xalsar

Ich habe das gelöst.

Umgehen Sie:

  1. Fügen Sie Ihrer TypeScript-Datei ein Boolesches Flag hinzu, und setzen Sie standardmäßig die Option "Deaktivieren" (false)
  2. Platzieren Sie *ngIf In Ihrem HTML
  3. Auf ngAfterViewInit() setze das auf true
0