Question

我知道这是一个非常基本的问题，但我坚持这一点。我有两个输入框，我想计算这些输入，并立即将结果显示到另一个输入（第三个），而无需提交按钮。我的意思是，一旦我开始将值输入到输入中，结果将显示在第3个输入中，它代表结果......

<input type="text" class="input value1">
<input type="text" class="input value2">
<input type="text" disabled="disabled" id="result">

<script>
 $(document).ready(function(){
      var val1 = $(".value1").val();
      var val2 = $(".value2").val();
      $(".input").keyup(function(){
         $("#result").text(val1+val2);
       });
});
</script>

Answer 1

将val1和val2放在keyup语句中。

$(document).ready(function(){
    $(".input").keyup(function(){
          var val1 = +$(".value1").val();
          var val2 = +$(".value2").val();
          $("#result").val(val1+val2);
    });
});

看小提琴：http://jsfiddle.net/g7zz6/

Answer 2

在你所说的SUM的假设下，输入本质上是数字的。

$(".input").on("change", function(){
    var ret = Number($(".value1").val()) + Number($(".value2").val());
    $("#result").val(ret);
}

Answer 3

只需设置文本值，你也需要解析它们，因为它们将被串联为字符串。

$(document).ready(function () {
    var val = parseInt($(".value1").val()) + parseInt($(".value2").val());
    $("#result").text(val);
});

Live Demo

Answer 4

 function addinput(){ 
   var x= Number(document.getElementById("first").value);
   var y= Number(document.getElementById("second").value);
   var z= Number(x+y);
   document.getElementById("l").value = Number(z);     
 }

如何计算两个输入表单字段并将值放入另一个而不使用jquery提交表单？

4 个答案: