9

我已经分配了一个添加两个文本框值的任务。我希望添加的结果出现在第三个文本框中，只要在前两个文本框中输入值，而不按任何按钮。

例如：在第一个文本框中我想输入 450，当我按数字 '450' 的第 4 位时，它将被添加到第三个文本框中，我在前两个文本框中按的任何数字，突然会反映变化在第三个文本框上。我该怎么做？

在这里，我在 onkeyup 中编写我的代码调用 sum()

onkeyup="sum()"
function sum() {
        var txtFirstNumberValue = document.getElementById('txt1').value;
        var txtSecondNumberValue = document.getElementById('txt2').value;
        var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
        if(!isNaN(result)){
            document.getElementById('txt3').value = result;
        }
}

这在 chrome 中不起作用

4

8 回答 8

17

尝试这个

  function sum() {
       var txtFirstNumberValue = document.getElementById('txt1').value;
       var txtSecondNumberValue = document.getElementById('txt2').value;
       if (txtFirstNumberValue == "")
           txtFirstNumberValue = 0;
       if (txtSecondNumberValue == "")
           txtSecondNumberValue = 0;

       var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
       if (!isNaN(result)) {
           document.getElementById('txt3').value = result;
       }
   }
于 2013-05-21T11:20:28.303 回答
9

试试这个：在 Chrome 中打开给定的小提琴

function sum() {
      var txtFirstNumberValue = document.getElementById('txt1').value;
      var txtSecondNumberValue = document.getElementById('txt2').value;
      var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
      if (!isNaN(result)) {
         document.getElementById('txt3').value = result;
      }
}

HTML

<input type="text" id="txt1"  onkeyup="sum();" />
<input type="text" id="txt2"  onkeyup="sum();" />
<input type="text" id="txt3" />

在这里演示

于 2013-05-21T11:21:55.607 回答
1

我没有找到优雅的答案，这就是为什么让我说：

Array.from(
   document.querySelectorAll('#txt1,#txt2')
).map(e => parseInt(e.value) || 0) // to avoid NaN
.reduce((a, b) => a+b, 0)


window.sum= () => 
 document.getElementById('result').innerHTML=    
   Array.from(
     document.querySelectorAll('#txt1,#txt2')
   ).map(e=>parseInt(e.value)||0)
   .reduce((a,b)=>a+b,0)
<input type="text" id="txt1" onkeyup="sum()"/>
<input type="text" id="txt2" onkeyup="sum()"  style="margin-right:10px;"/><span id="result"></span>

于 2016-08-05T11:02:36.240 回答
0

好吧，我认为问题解决了以下代码有效：

function sum() {
    var result=0;
       var txtFirstNumberValue = document.getElementById('txt1').value;
       var txtSecondNumberValue = document.getElementById('txt2').value;
    if (txtFirstNumberValue !="" && txtSecondNumberValue ==""){
        result = parseInt(txtFirstNumberValue);
    }else if(txtFirstNumberValue == "" && txtSecondNumberValue != ""){
        result= parseInt(txtSecondNumberValue);
    }else if (txtSecondNumberValue != "" && txtFirstNumberValue != ""){
        result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue);
    }
       if (!isNaN(result)) {
           document.getElementById('txt3').value = result;
       }
   }
于 2013-05-21T12:13:22.100 回答
0

好吧，根据您的代码，您可以在每个文本框txt1 和 txt2中放置onkeyup=sum()

于 2013-05-21T11:17:10.757 回答
0

这是正确的代码

function sum() 
{ 
    var txtFirstNumberValue = document.getElementById('total_fees').value; 
    var txtSecondNumberValue = document.getElementById('advance_payement').value; 
    var result = parseInt(txtFirstNumberValue) - parseInt(txtSecondNumberValue); 
    if(txtFirstNumberValue=="" ||txtSecondNumberValue=="") 
    { 
        document.getElementById('balance_payement').value = 0; 
    }
    if (!isNaN(result)) 
    { 
        document.getElementById('balance_payement').value = result;
    }
}
于 2014-08-07T07:08:55.277 回答
0

由于eval("3+2")=5，您可以按以下方式使用它：

byId=(id)=>document.getElementById(id); 
byId('txt3').value=eval(`${byId('txt1').value}+${byId('txt2').value}`)

这样你就不需要 parseInt

于 2016-08-05T11:08:58.530 回答
0

在下面的代码中，我已经完成了求和和减法的操作：因为如果你想调用函数，则使用JavaScriptdocument.ready(function{ }); ，那么你必须将下面的代码放在脚本结束标记之外和之外。

我已经为此操作使用了另一个脚本标签。并在脚本开始标签//您的代码//脚本结束标签之间放置下面的代码。

 function operation() 

 {

   var txtFirstNumberValue = parseInt(document.getElementById('basic').value);
   var txtSecondNumberValue =parseInt(document.getElementById('hra').value);
   var txtThirdNumberValue =parseInt(document.getElementById('transport').value);
   var txtFourthNumberValue =parseInt(document.getElementById('pt').value);
   var txtFiveNumberValue = parseInt(document.getElementById('pf').value);

   if (txtFirstNumberValue == "")
       txtFirstNumberValue = 0;
   if (txtSecondNumberValue == "")
       txtSecondNumberValue = 0;
   if (txtThirdNumberValue == "")
       txtThirdNumberValue = 0;
   if (txtFourthNumberValue == "")
       txtFourthNumberValue = 0;
   if (txtFiveNumberValue == "")
       txtFiveNumberValue = 0;



   var result = ((txtFirstNumberValue + txtSecondNumberValue + 
  txtThirdNumberValue) - (txtFourthNumberValue + txtFiveNumberValue));
   if (!isNaN(result)) {
       document.getElementById('total').value = result;
   }
 }

并将onkeyup="operation();"所有 5 个文本框放入您的 html 表单中。此代码在 Firefox 和 Chrome 中运行。

于 2017-01-09T06:34:27.260 回答