2017-09-27 5 views
0

Ich war Tring den Wert der Texteingabe mit Folge Code zu erhalten:document.getElementById ('url_input') Wert druckt nicht den Wert

var input = document.getElementById('url_input').value; 

und

document.getElementById("send_url").onclick = function(){ 
    console.log(input); 
} 

diese doesn arbeite zwar nicht, aber wenn ich das so ändere:

var input = document.getElementById('url_input'); 
document.getElementById("send_url").onclick = function(){ 
    console.log(input.value); 
} 

was ist der Unterschied zwischen diesen beiden? Warum funktioniert der erste nicht?

+0

Bitte posten Sie Ihre HTML. –

+0

Speichern des Werts im Vergleich zum Lesen des Werts. – epascarello

+0

Poste volles HTML bitte, aber scheint, dass du Eingangswert speicherst, bevor du den Wert in der Eingabe festlegst –

Antwort

1

was ist der Unterschied zwischen diesen beiden?

In Ihrem ersten Beispiel Sie kopieren der Wert in input:

var input = document.getElementById('url_input').value; 

und dann diesen Wert immer wieder neu einloggen:

document.getElementById("send_url").onclick = function(){ 
    console.log(input); 
} 

Kopieren Sie den Wert in input ‚doesn t Sie können zwischen input und HTMLInputElementvalue jede Art von Verbindung herstellen. Es kopiert nur den Wert valueab, wenn diese Codezeile in input ausgeführt wird.

In Ihrem zweiten Beispiel, werden Sie den Wert aus dem HTMLInputElement bekommen jedes Mal: ​​

var input = document.getElementById('url_input'); 
document.getElementById("send_url").onclick = function(){ 
    console.log(input.value); 
} 

Auf jeden Klick, sind Sie die HTMLInputElement für seine aktuellen Zustand zu fragen. Beachten Sie, dass der Wert in input sich immer noch nicht zwischen den Klicks ändert. Es ist ein Verweis auf das Element url_input, bei dem es sich um ein Objekt handelt, und dieser Verweis wird in diesem Code nicht geändert. Es ist der Zustand des Objekts (der HTMLInputElement), der sich ändert, und Sie fragen es für seinen aktuellen Zustand jedes Mal.

1

Weil, wenn Sie das .value lesen, ist es der Wert zu diesem Zeitpunkt. Die Variable wird nicht aktualisiert, wenn sich die Eigenschaft ändert. So

wenn Sie das tun

var input = document.getElementById('url_input').value 

Wenn speichert der Wert in diesem Moment in der Zeit und dass der Wert ist, der in den Variablen sein wird.

Verwandte Themen