亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Community

Learn

Tools Library

AI Tools

Leisure

English

javascript - The value output by js does not meet the expectations. I really don't understand it.

迷茫 2017-05-19 10:30:26

710

var number1 = document.getElementById("queue");
height1 = number1.value+("px");

queue is an input box, number1.value is its input value (a number), but the output of height1 is always px without any number.
for example:

console.log(number1.value); //20
console.log(height1);//px

I also tried a method

var number1 = document.getElementById("queue");
var number1Value = number1.value;
height1 = number1Value+("px");

This time it’s even weirder,

console.log(number1.value);//20
console.log(number1Value);//

console.log(number1.value.constructor == String);//true

Proofnumber1.value is a string, then string plus string should be OK

迷茫

業(yè)精于勤，荒于嬉;行成于思，毀于隨。

reply all(3)

PHPzhong2017-05-19 10:32:26 3 floor

1. Probably what you understand

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" id="input">
</body>
<script>
var val=document.getElementById("input");
var height=val.value+"px";//你這個地方 定義height的時候 val.value并不存在
console.log(height)//px
</script>
</html>

2. The correct way to obtain it

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" id="input" value="20">
</body>
<script>
var val=document.getElementById("input");
var height=val.value+"px";//你這個地方 定義height的時候 val.value已經(jīng)存在
console.log(height)//20px
</script>
</html>

3. Another way to monitor the content in the input box

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" id="input" onchange="getVal()">
</body>
<script>
var val=document.getElementById("input");
function getVal() {
    var height=val.value+"px";
    console.log(height)//這種只要input值發(fā)生改變  這個地方就會有輸出  
}

</script>
</html>

Like +0

Add Reply

曾經(jīng)蠟筆沒有小新2017-05-19 10:32:26 2 floor

You are executing it when you open the page. The function is only executed once. When you enter the value again, you do not execute the method, and the first time the value is empty!

Like +0

Add Reply

僅有的幸福2017-05-19 10:32:26 1 floor

You need an event handling function. When the page is just loaded, the value must be empty, because you have not written a value in the input yet
var height = 0;
var input = document.querySelector('#input');
var btn = document.querySelector('#btn');
btn.addEventListener('click', function(){

var value = input.value;
height = value + 'px';

}, false)

Like +0

Add Reply