鍵盤功能無法處理表單輸入

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());

我測試了它，它工作正常。