如何使用输入类型编号中的值进行计算并将值设置为其他输入？

Question

如何使用输入类型数值中的值来计算和设置其他输入值？

当填充值转换成这种情况下输入id xxx填写5我想该值用于multiple with 3并获得价值15到输入id yyy

我该怎么办？

<p> 
 
<input name="xxx" type="number" id="xxx" onkeydown="return isNumber(event)"> 
 
</p> 
 

 
<p> 
 
<input name="yyy" type="number" id="yyy" disabled > 
 
</p> 
 

 

 
<script> 
 
function isNumber(number_check) { 
 
    number_check = (number_check) ? number_check : window.event; 
 
    var charCode = (number_check.which) ? number_check.which : number_check.keyCode; 
 
    if (charCode > 31 && (charCode < 48 || charCode > 57)) { 
 
     return false; 
 
    } 
 
    return true; 
 
} 
 
</script>

Answer 1

由于输入#xxx的型号，你不需要return false是价值不是数字......它只是不能发生。

因此，您只需获取值并将其解析为一个整数（输入的值类型为文本）以对其执行数学运算。

然后，正确的事件是keyup，比keydown更多（因为此时该值还没有在该字段中）或更改。

$("#xxx").on("keyup change", function(){ 
 
    $("#yyy").val(parseInt($("#xxx").val())*3); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<p> 
 
<input name="xxx" type="number" id="xxx"> 
 
</p> 
 

 
<p> 
 
<input name="yyy" type="number" id="yyy" disabled > 
 
</p>

Answer 2

你可以用一个简单的函数

function isNumber(number_check) { 
 
    number_check = (number_check) ? number_check : window.event; 
 
    var charCode = (number_check.which) ? number_check.which : number_check.keyCode; 
 
    if (charCode > 31 && (charCode < 48 || charCode > 57)) { 
 
     return false; 
 
    } 
 
    return true; 
 
} 
 
var multiplyBy3 = function() { 
 
    var x = document.getElementById("xxx").value; 
 
    document.getElementById("yyy").value = x * 3; 
 
}

<p> 
 
<input name="xxx" type="number" id="xxx" onkeydown="return isNumber(event)"> 
 
</p> 
 
<button onclick="multiplyBy3()">Multiply By 3</button> 
 
<p> 
 
<input name="yyy" type="number" id="yyy" disabled > 
 
</p>