jquery单击并计算更多输入

我是Jquery的新手：

我有一个点击功能和一个更改功能：似乎更改功能“停止”了点击功能的工作：

$(".calc").click(function() {


    for (i = 1; i <= 2; i++) {

        $("#p" + i).val(parseFloat((parseFloat($("#amount" + i).val())) / (parseFloat($("#q" + i).val()))).toFixed(5)).change();


    }

});

$('.priceRow').change(function() {

    var q1 = parseFloat($('#q1').val(), 10);
    var qval1 = 0;
    if (q1 > 0) {
        qval1 = q1;
    }

    var q2 = parseFloat($('#q2').val(), 10);
    var qval2 = 0;
    if (q2 > 0) {
        qval2 = q2;
    }

    var p1 = parseFloat($('#p1').val(), 10);
    var puval1;
    if (p1 > 0) {
        puval1 = p1;
    }
    var p2 = parseFloat($('#p2').val(), 10);
    var puval2 = 0;
    if (p2 > 0) {
        puval2 = p2;
    }

    var subtot1;

    subtot1 = parseFloat(qval1 * puval1);

    var subtot2;
    subtot2 = parseFloat(qval2 * puval2);
    var subtot = 0;

    $('#amount1').val(parseFloat(subtot1).toFixed(2)).change();
  //  $('#amount2').val(parseFloat(subtot2).toFixed(2)).change();


});

$（“.calc”）。单击（函数（）{
对于（i=1；i 0）{
qval1=q1；
}
var q2=parseFloat（$（'#q2'）.val（），10）；
var qval2=0；
如果（q2>0）{
qval2=q2；
}
var p1=parseFloat（$（'#p1'）.val（），10）；
var puval1；
如果（p1>0）{
puval1=p1；
}
var p2=parseFloat（$（'#p2'）.val（），10）；
var puval2=0；
如果（p2>0）{
puval2=p2；
}
var小计1；
subtot1=解析浮点（qval1*puval1）；
var小计2；
subtot2=解析浮点（qval2*puval2）；
var小计=0；
$（'#amount1'）.val（parseFloat（subtot1）.toFixed（2））.change（）；
//$（'#amount2'）.val（parseFloat（subtot2）.toFixed（2））.change（）；
});

}))

html代码

<div class="priceRow">
q1 : <input id="q1" value="0" class="priceRow"/>
p1 : <input id="p1" value="0" class="priceRow"/>
<a href="#" id="calc2" class="calc">calc</a>
</div>
<div class="priceRow">
 q2 :  <input id="q2" value="0"/>
 p2 :  <input id="p2" value="0" />
<a href="#" id="calc2" class="calc">calc</a> 
</div>
<br>
amount1: <input id="amount1" class="subtot">  </span><br>
amount2: <input id="amount2" class="subtot">  </span><br>
</p>

问题1：
p1：
问题2：
p2：


金额1:

数量2:

单击功能在第二行不起作用：我的错误是什么

非常感谢

演示：

我认为您需要将更改事件处理程序附加到价格行中的文本框。div上的更改事件充其量是不确定的。尝试将更改事件附件更新到以下内容

$('.priceRow input:text').change(...);

加

添加到id为p2和q2的输入字段。目前只有p1和q1具有该功能

---

我建议你从头开始

不能在页面中复制ID。你应该改用class

要仅处理

行中的元素

，您需要使用

最近的（）

遍历到该行的主父级，并使用

查找（）

仅查找该行中的元素

例如：

$(".calc").click(function(){
   /* "this" is the current element clciked*/

    var $row= $(this).closest( '.priceRow')
     var q1=$row.find('.q1');/* note using class="q1" not ID*/
});

change

事件只在表单输入上发生，因此您的

$（'.priceRow'）。change

永远不会触发

$(".calc").click(function(){
   /* "this" is the current element clciked*/

    var $row= $(this).closest( '.priceRow')
     var q1=$row.find('.q1');/* note using class="q1" not ID*/
});