2

我有三个像这样的单选按钮：

<input type="radio" name="P_1" value="1">Yes</input>
<input type="radio" name="P_1" value="2">No</input>

<input type="radio" name="P_2" value="1">Yes</input>
<input type="radio" name="P_2" value="2">No</input>

<input type="radio" name="P_3" value="1">Yes</input>
<input type="radio" name="P_3" value="2">No</input>

我正在尝试为每个单选按钮添加一个侦听器，以便在它们更改时通知我。我正在做这样的事情：

for (var i = 1; i <= 3; i++) {
            $("input[name='P_" + i + "']").live('change', function () {
                doProcessing("P_" + i, $("input[name='P_" + i + "']:checked").val());
            });
}

但是，这似乎不起作用。它调用setdoProcessing为i4 因为这是ifor 循环结束时的值。在我的情况下添加事件处理程序的正确方法是什么？

4

3 回答 3

8

尝试

$('input:radio').on('change', function(){
    //access value of changed radio group with $(this).val()
});

或者，如果您使用的是 < jQuery 1.7

$('input:radio').live('change', function(){
    //do stuff with $(this).val()
});
于 2012-04-16T00:33:26.417 回答
2

与任何异步迭代值一样，您需要关闭循环中的值：

for (i = 0; i < 3; i++) {
    (function(i){
        ...your code here...
    }(i));
}

到调用事件处理程序时，i变量的值将达到其最大值（在本例中3）。

将数据传递给每个处理程序的另一种方法是使用方法data的参数：on

for (i = 0; i < 3; i++) {
    $(...selector...).on('change', null, {i:i}, function (e) {
        //access the i value with: e.data.i
    });
}

最好在处理程序中简单地检查正确的值，并使用一个类来附加事件：

$(document).on('change', '.someClass', function (e) {
    var i,
        $this;
    $this = $(this);
    i = $(this).attr('name').substr(2);
    i = parseInt(i, 10);
    ...your code here...
});

如果您无法更改标记，则可以使用'[name^="P_"]'.'.someClass'

于 2012-04-16T00:30:04.443 回答
1

您必须使用一个闭包来记住每一步的索引值。以下是许多可能的方法之一：

for (var i = 1; i <= 3; i++) {
   $("input[name='P_" + i + "']").live('change', createListener(i));
}

function createListener(index) {
    return function() {
        doProcessing("P_" + index, $("input[name='P_" + index + "']:checked").val());
    }
}
于 2012-04-16T00:29:08.540 回答