如何使用輸入類型編號中的值進行計算並將值設置爲其他輸入？

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>