Calculation in javascript

Calculation in javascript

本文关键字：javascript in Calculation      更新时间：2023-09-26

我的HTML看起来是这样的：

<input type="text" id="qty">
<input type="text" id="unp">
<input type="text" id="tv">
<input type="text" id="qty2">
<input type="text" id="unp2">
<input type="text" id="tv2">
<input type="text" id="qty3">
<input type="text" id="unp3">
<input type="text" id="tv3">
...

如何计算tv = qty*unp和tv2 = qty2*unp2？

首先，由于tv*是结果字段，请禁用它们。

$("input[id^=tv]").attr('disabled','disabled');

然后：

$("input[id^=qty], input[id^=unp]").keyup(function(){
    var index = $(this).attr("id").replace("qty","").replace("unp","");
    $("#tv"+index).val(parseInt($("#qty"+index).val())*parseInt($("#unp"+index).val()))
    if($("#tv"+index).val()=="NaN"){$("#tv"+index).val("");}
})

JSFIDDLE

是的，不要忘记通过添加导入jQuery

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

在输入之前。

您可以很容易地获得输入值，如下所示：

document.getElementById('qty').value

并将它们设置为：

document.getElementById('tv').value = 'Hi!';

因此，使用这些信息，您可以很容易地将另一个输入的值设置为其他两个输入的总和：

var qty = Number(document.getElementById('qty').value);
var unp = Number(document.getElementById('unp').value);
document.getElementById('tv').value = qty + unp;

Number()只是把一个字符串变成一个数字。

示例：

document.getElementById('tv').onclick = function(){
  var qty = Number(document.getElementById('qty').value);
  var unp = Number(document.getElementById('unp').value);
  
  document.getElementById('tv').value = qty + unp;
};
document.getElementById('tv2').onclick = function(){
  var qty2 = Number(document.getElementById('qty2').value);
  var unp2 = Number(document.getElementById('unp2').value);
  
  document.getElementById('tv2').value = qty2 + unp2;
};
<input type="text" id="qty">+
<input type="text" id="unp">=
<input type="text" id="tv" placeholder="Click me!">
<br>
<input type="text" id="qty2">+
<input type="text" id="unp2">=
<input type="text" id="tv2" placeholder="Click me!">

function tvFunction() { 
       var inputTags = document.getElementsByTagName('INPUT');  
  for(var i=1; i<=inputTags.length ; i++){
        if(i == 1) 
        {
        var qty= document.getElementById('qty').value;
        var unp = document.getElementById('unp').value;
        var result= Number(qty)*Number(unp);
        document.getElementById('tv').value = result;
        }
     else 
     {
        var qty= document.getElementById('qty'+i).value;
        var unp = document.getElementById('unp'+i).value;
        var result= Number(qty)* Number(unp);
        document.getElementById('tv'+i).value = result;
     }
  }
  }
     <input type="text" id="qty">
<input type="text" id="unp">
<input type="text" id="tv">
<input type="text" id="qty2">
<input type="text" id="unp2">
<input type="text" id="tv2">
<input type="text" id="qty3">
<input type="text" id="unp3">
<input type="text" id="tv3">
<input type="text" id="qty4">
<input type="text" id="unp4">
<input type="text" id="tv4">
<input type="text" id="qty5">
<input type="text" id="unp5">
<input type="text" id="tv5">
<input type="text" id="qty6">
<input type="text" id="unp6">
<input type="text" id="tv6">
<input type="text" id="qty7">
<input type="text" id="unp7">
<input type="text" id="tv7">
<input type="text" id="qty8">
<input type="text" id="unp8">
<input type="text" id="tv8">
    <input type="button" id="btn3"
           onclick="tvFunction()" value="Calculate">

基本代码：

var tv = document.getElementById("qty").value * 
document.getElementById("unp").value;
document.getElementById("tv").value = tv;
var tv2 = document.getElementById("qty2").value * 
document.getElementById("unp2").value
document.getElementById("tv2").value = tv2;
相关文章：