JavaScript> If I set "var x = document.getElementById (" inputText "). The value is" and I update the "x", why is the value not updated?

In the following example, why the "value" of the "input" test "is not updated to the" second "?

<html> <head> <script type="text/javascript"> getText = function() { var test = document.getElementById('test').value; test = "second"; //note: if you insert "alert(test)" it returns "second" } </script> </head> <body> <label for="test">Test </label><input type="text" id="test" value="first" onclick="getText()"></input> </body> </html> 
+4
source share
12 answers

Because Javascript assigned x as a value, not a reference to the source object.

For example, you could instead:

 function setText(x) { document.getElementById('test').value = x; } getText = function() { return document.getElementById('test').value; } 

And the value set with setText() will be reflected by getText() , since getText() will also use the value of the reference object, not a copy of the value.

EDIT

As Brian points out, this will be a copy from a link with a global scope:

 var test = document.getElementById('test'); function setText(x) { test.value = x; } getText = function() { return test.value; } 

http://jsfiddle.net/nLj2A/

The original variable test stores a reference to the element, not the value associated with the element attribute.

+5
source

You copy the value to a variable. Changing a variable will not change the original, because the variable just contains a copy.

If you store the element reference in a variable, you can use it to set the value:

 var test = document.getElementById('test'); test.value = "second"; 
+3
source

You assign an element value to a variable and then change the variable. This is not reflected back in the value of the element. Instead, you need to change the value of the element.

 document.getElementById('test').value = "second"; 
+1
source

Because you set the value of test as the string document.getElementById('test').value .

You do not bind them together.

If you want to do this, you can use the function:

 function test(x) { document.getElementById('test').value = x; } test('foo'); 

In Python you can do this. In JavaScript, I don't think so.

0
source

because

 document.getElementById('test').value 

is a getter, where as

 document.getElementById('test').value = "second" 

- setter

0
source
 test = document.getElementById('test').value; 

... only gives you a copy of the value at this moment. When you modify test , you need to put this back in the input field that you want to change:

 var test_input = document.getElementById('test'); test_input.value = "second"; 
0
source

Setting the local variable test to "second" will do nothing. I assume you want getText to update the DOM. Try the following:

  getText = function() { document.GetElementById('test').value("second"); } 
0
source

Points to an element instead of a value: http://jsbin.com/axufi4/edit

0
source

Although javascript ultimately sees everything as an object, I believe that only arrays and objects are passed by reference. Strings, ints and float are passed by value.

Text inputs always give you a string (even if you restrict the input of numbers)

0
source
 <script type="text/javascript"> getText = function() { var test = document.getElementById('test').value; test = "second"; //note: if you insert "alert(test)" it returns "second" document.getElementById('test').value = test; } </script> 
0
source

You need to do this:

 document.getElementById('test').value = "second"; 

or

 var el = dcument.getElementById('test'); el.value = "second"; 

As for why, I think this is due to something like that Javascript is the language "pass by reference" or "pass by value", which was a very interesting discussion here on SO. (I'm not sure about this, correct me if I am wrong).

0
source

because it is a string and is passed as a value, not as a link. therefore, the contents of the value are copied for verification

0
source

All Articles