如何使用jquery添加两个文本框值并传递给另一个动态创建文本框的文本框

Question

添加两个文本框的值，并在循环内的另一个文本框中显示总和。

代码在这里：

<input class="common" name="1" id="id1" value="">
<input class="common" name="2" id="id2" value="">
<input name="3" id="id3" value="" readonly>    

$('.common').change(function () {
    $('#id3').val(parseFloat("0"+$('#id1').val()) + parseFloat("0"+$('#id2').val()));
});

我想传递多次textbox值。请检查屏幕截图：

感谢您的帮助

Answer 1

我的解决方案：

$('.common').change(function() {
    var sum = 0;
    $('.common').each(function(index) {
        if($(this).val()) {
            sum += parseFloat($(this).val());
        }
    });
    $('#sum').val(sum);
});

小提琴：http://jsfiddle.net/theagitator/dz3bfL8k/1/

修改 请注意，您必须添加自己的验证。

Answer 2

<div class="equation">
    <input class="common" name="1" value="0" />
    <input class="common" name="2" value="0" />
    <input name="3" value="0" readonly="readonly" />
</div>
<div class="equation">
    <input class="common" name="1" value="0" />
    <input class="common" name="2" value="0" />
    <input name="3" value="0" readonly="readonly" />
</div>
<div class="equation">
    <input class="common" id="id1" value="0" />
    <input class="common" id="id2" value="0" />
    <input name="3" value="0" readonly="readonly" />
</div>
...

<script>
$('.equation').each(function(index, element){
    element = $(element);
    element.find('.common').change(function () {
        var val1 = parseFloat(element.find('input[name="1"]').val());
        var val2 = parseFloat(element.find('input[name="2"]').val());
        element.find('input[name="3"]').val(val1 + val2);
    });
});
</script>

尝试一下： http://jsfiddle.net/CaseyRule/yLLqgbtc/