jQuery獲取輸入的ID與keyup上的類不起作用

Question

我在這裏有我的代碼有點問題。我試圖完成的是獲取輸入字段的ID。所有感興趣的輸入字段都有一個「計數」類。他們都有相同的ID，但它增加，說field1，field2，field3。我也有一些「答案」輸入。

我試圖完成的機制是首先從我正在鍵入的輸入（keyup）中獲取ID。然後我繼續將該值（var valueField）傳遞給函數updateFields（idNumber）。之後，我只需簡單地將＃100的值加上100，最後我將最終值添加到其匹配的輸入中，並使用answerx的id。

我的代碼無法正常工作。有人知道爲什麼嗎？這種方法是否正確？或者你會建議我改變一下嗎？

這裏是我的代碼：

HTML：

<input type="text" placeholder="" class="count" name="input1" id="1"/> 
<input type="text" placeholder="" class="count" name="input2" id="2"/> 
<input type="text" placeholder="" class="count" name="input3" id="3"/> 

<input type="text" placeholder="" class="answer" name="ans1" id="answer1"/> 
<input type="text" placeholder="" class="answer" name="ans2" id="answer2"/> 
<input type="text" placeholder="" class="answer" name="ans3" id="answer3"/> 

的JavaScript：

$(document).on('keyup','.count',function(){ 
     var valueField = $(this).attr('id').val(); 
     updateFields(valueField); 
    }); 

    function updateFields(idNumber){ 

     var rawVal = $('#field' + idNumber).val(); 
     var final = rawVal + 100; 

     $('#answer' + idNumber).val(final) 

    } 

提前感謝！

Answer 1

當你得到attr('id')你不需要撥打.val()。此外，您的代碼來獲取該字段假設一個ID以'字段'開頭，最後如果你要採取文本輸入和治療是一個數字，你應該撥打電話parseInt()（十進制小數爲10），這將工作：

$(document).on('keyup', '.count', function() { 
 
    var valueField = $(this).attr('id'); 
 
    updateFields(valueField); 
 
}); 
 

 
function updateFields(idNumber) { 
 
    var rawVal = parseInt($('#' + idNumber).val(), 10); 
 
    var final = rawVal + 100; 
 

 
    $('#answer' + idNumber).val(final) 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" placeholder="" class="count" name="input1" id="1" /> 
 
<input type="text" placeholder="" class="count" name="input2" id="2" /> 
 
<input type="text" placeholder="" class="count" name="input3" id="3" /> 
 

 
<input type="text" placeholder="" class="answer" name="ans1" id="answer1" /> 
 
<input type="text" placeholder="" class="answer" name="ans2" id="answer2" /> 
 
<input type="text" placeholder="" class="answer" name="ans3" id="answer3" />