javascript document.getElementById().value

Question

Sorry, I'm newbie,

<html>
<head>
<script type="text/javascript">
var x = document.getElementById('x').value;
var y = document.getElementById('y').value;
var z = x + y;
alert(z);
</script>
</head>

<body>
<input type="number" id="x" />
<input type="number" id="y" />
</body>

</html>

If my input x = 100, and y input = 200. My popup alert are 100200.

How to fixed this?

thank you.

Answer 1

It's because the value is a string , you need to convert it to a number and then do the addition.. This should do it..

<html>
<head>
<script type="text/javascript">
    var x = parseInt(document.getElementById('x').value);
    var y = parseInt(document.getElementById('y').value);
    var z = x + y;
    alert(z);
</script>
</head>

<body>
    <input type="number" id="x" />
    <input type="number" id="y" />
</body>

</html>

Function parseInt will convert the string to an integer number and then 100+200 will be 300.

Find the Fiddle here

Answer 2

Use

var z = parseInt(x) + parseInt(y);

Answer 3

You need to typecast variables using parseInt(var) since they are strings.

<html>

<head>
    <script type="text/javascript">
    var x = document.getElementById('x').value;
    var y = document.getElementById('y').value;
    var z = parseInt(x) + pasreInt(y);
    alert(z);
    </script>
</head>

<body>
    <input type="number" id="x" />
    <input type="number" id="y" />
</body>

</html>

javascript document.getElementById().value

Question

3 answers

solution1
0 ACCPTED 2015-02-27 06:34:06

solution2
0 2015-02-27 06:34:45

solution3
0 2015-02-27 06:35:19

javascript document.getElementById().value

Question

3 answers

solution1 0 ACCPTED 2015-02-27 06:34:06

solution2 0 2015-02-27 06:34:45

solution3 0 2015-02-27 06:35:19

solution1
0 ACCPTED 2015-02-27 06:34:06

solution2
0 2015-02-27 06:34:45

solution3
0 2015-02-27 06:35:19