键盘功能无法处理表单输入

Question

希望有人可以解释我的问题。 我有三个输入字段，在填充所有三个字段时计算公式。 我使用keyup函数来检测字段何时有内容，但对于我的生活，我无法让它工作。 任何帮助将非常感谢。

  $(".input-sm").each(function() { $(this).keyup(function() { calculateStuff(); }); }); function calculateStuff() { //add only if the value is number if (!isNaN($('#pa').val()) && $('#pa').val().length != 0) { pa = parseFloat(this.value); } if (!isNaN($('#de').val()) && $('#de').val().length != 0) { de = parseFloat(this.value); } if (!isNaN($('#pr').val()) && $('#pr').val().length != 0) { pr = parseFloat(this.value); } re = pa + de + pr; stuff = ((pr - de) / (re)) * 100; $("#value").html(stuff); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h1 id="value" class="mt-50">Stuff = 0</h1> <input type="text" class="form-control input-sm" id="de"> <input type="text" class="form-control input-sm" id="pa"> <input type="text" class="form-control input-sm" id="pr"> 

Answer 1

第一：你可以使用.keyup而不需要.each

$(".input-sm").on('keyup',function() {
   calculateStuff($(this));
});

第二步：在转到if语句之前尝试用0定义变量

第三： this.value将不返回任何内容，因此传递给你的函数$(el).val()并在keyup中使用它

function calculateStuff(el) {
     var pa = 0, de = 0, pr = 0 , re = 0, stuff = 0;
     //add only if the value is number
     if (!isNaN($('#pa').val()) && $('#pa').val().length != 0) {
        pa = parseFloat($(el).val());
     }
     if (!isNaN($('#de').val()) && $('#de').val().length != 0) {
        de = parseFloat($(el).val());
     }
     if (!isNaN($('#pr').val()) && $('#pr').val().length != 0) {
         pr = parseFloat($(el).val());
     }

  re = pa + de + pr;
  stuff = ((pr - de) / (re)) * 100;
  $("#value").html(stuff);
}

Answer 2

我试过你的代码。 你在控制语句中使用（this.value）并且“this”是未定义的，你实际上没有从它来自哪里引用。 将（this.value）替换为输入元素的相应id，就像这样=>（$（'＃pa'）。val（））。

     //e.g.
     pa = parseFloat($('#pa').val());

我测试了它，它工作正常。