Question

我有动态生成的文本框，并希望使用jquery对其值进行计算。

文本框名称如下：

A[1] , B[1]  - on change event , Alert SUM of values of A[1] and B[1]

A[2] , B[2]  - on change event , Alert SUM of values of A[2] and B[2] 

A[3] , B[3]   - on change event , Alert SUM of values of A[3] and B[3]

.
.
.
.
A[10] , B[10]   - on change event , Alert SUM of values of A[10] and B[10]

如何在jquery中为此任务创建一个函数。请帮我完成这项任务。

我有这个代码，但是它用于所有文本框A和B，但是我想指定A [1]和B [1]的和谐值，A [2]和B [2]的和.......

$("input[type='text'][name^='A'] ,input[type='text'][name^='B']").
keyup(function(){ 

alert(sumThemUp());

});


function sumThemUp(){
var sum = 0;

$("input[type='text'][name^='A'] ,input[type='text'][name^='B']").
each(function(){

sum+= parseInt($(this).val());

});

return sum;

    };

我的HTML是：

<input type="text" name="A[1]">
<input type="text" name="B[1]">
<input type="text" name="A[2]">
<input type="text" name="B[2]">
.
.
.
.
.<input type="text" name="A[10]">
<input type="text" name="B[10]">

Answer 1

我认为你正在尝试这样的事情：

$('input[type=text]').on('keyup', function() {
    var cur = this.name;
    if(cur.indexOf('A') == 0){
       var target = 'B' + cur.replace('A','');
    } else target = 'A' + cur.replace('B','');
    var targetVal = $('input[name="'+ target +'"]').val();
    var sum = parseInt(this.value) + parseInt(targetVal ? targetVal: 0);
    console.log(sum);
});

<强> Working Demo

Answer 2

这可能是我能想到的最简单的方法。它需要稍微修改你的动态DOM内容，但我假设你总是生成一个A和一个B，所以这应该不是问题。

HTML：

<span class="calc_group">
    <input type="text" name="A[1]">
    <input type="text" name="B[1]">
</span>
<span class="calc_group">
    <input type="text" name="A[2]">
    <input type="text" name="B[2]">
</span>

jQuery的：

注意：每次添加都需要在动态DOM函数中调用它！

function doAttachment(){
     $('.calc_group input').unbind('keyup');

     $('.calc_group input').keyup(function(){
           var sum = 0;
           $(this).parent().children().each(function(){
                sum += parseInt($(this).val());
           });

           alert(sum);
      });
}

Jquery使用多个文本框，文本框数组

2 个答案: