löschen Eingabefelder auf Seite aktualisieren (Microsoft Edge)

Question

Ich bin nur ein Anfänger, aber kann mir jemand helfen?

Ich habe eine HTML-Seite mit ein paar Eingabefeldern, und ich möchte die Felder gelöscht werden, wenn die Seite aktualisiert wird.

Mein HTML sieht wie folgt aus:

<input type='text' id='input_field' value=''> 

Dann zu Beginn meines Skript, dann ist es dieses:

document.getElementById('input_field').value = ''; 

Dies funktioniert in Firefox in Ordnung; Wenn die Seite aktualisiert wird, wird der Wert geleert und das Feld wird gelöscht.

Es funktioniert nicht in Microsoft Edge; Wenn die Seite aktualisiert wird, wird der tatsächliche Wert geleert, aber der Inhalt des Felds bleibt erhalten.

Ich habe auch versucht, meine Eingabeelemente in ein Formularelement zu verpacken und JavaScript zum Zurücksetzen des Formulars zu verwenden, aber die Ergebnisse sind dieselben.

Wie Sie sehen können, habe ich das Wert-Attribut im HTML beibehalten, aber nur für Demonstrations- und Experimentierzwecke. Das Auslassen hat in beiden Browsern keinen Effekt. Wenn ich jedoch das HTML-Attribut belasse, aber die JavaScript-Anweisung weglasse, verhalten sich beide Browser anders: In Edge "holt" der Inhalt des Feldes den tatsächlichen Wert auf (dh das Feld wird gelöscht), aber erst nachdem die Seite aktualisiert wurde zweimal; und in Firefox wird der Wert überhaupt nicht aktualisiert, unabhängig davon, wie oft die Seite aktualisiert wurde.

Schließlich, wenn ich die Quelle in irgendeiner Weise bearbeite und dann die Seite in Edge neu lade, leert es den tatsächlichen Wert und löscht auch das Feld, aber nur bei diesem anfänglichen Neuladen. Danach besteht das Problem weiterhin. Das lässt mich fragen, ob es ein Cache-Problem ist.

Irgendwelche Hilfe oder Vorschläge?

Answer 1

Zuerst, danke für die Antworten.

Ich hatte versucht autocomplete='off' (tut mir leid, ich habe vergessen zu erwähnen), aber es schien nicht zu funktionieren.

Kurz bevor ich hier nach Antworten suchte, entschied ich mich, ein anderes Experiment auszuprobieren. Ich fügte meiner Seite eine Schaltfläche hinzu, die beim Klicken eine Funktion aufruft, die die JavaScript-Anweisung .value = '' enthält.

Aus irgendeinem Grund funktionierte das gut; Es löschte den Wert und löschte das Feld, was mich denken ließ, dass das Binden des "Zurücksetzens" an ein bestimmtes HTML-Ereignis der Schlüssel sein könnte. Ich habe ein paar Dinge ausprobiert, die nicht funktionierten, aber am Ende habe ich das einfach ersetzt:

document.getElementById('input_field').value = ''; 

. . . mit diesem:

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

. . .und das hat es getan. Jedes Mal, wenn ich die Seite in Firefox oder Edge aktualisiere, wird der Wert geleert und das Feld wird gelöscht.

Ich bin mir nicht sicher, warum das funktioniert hat (wie ich schon sagte, ich fange gerade mit diesem Zeug an), aber da ist es.

Answer 2

Versuchen Sie, das Attribut autocomplete="off" dem Eingang hinzuzufügen.

<input autocomplete="off"> 

Dies funktioniert möglicherweise nicht bei allen Browsern. Wenn es nicht auf Edge funktioniert, versuchen Sie die Lösung auf dieser fiddle von Fizzix. Ursprünglicher Posten Chrome Browser Ignoring AutoComplete=Off.