2

次のような 3 つのラジオ ボタンがあります。

<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());
            });
}

ただし、これは機能しないようです。for ループの最後の の値であるため、set を 4doProcessingに設定して呼び出します。私の場合、イベント ハンドラーを追加する正しい方法は何ですか?ii

4

3 に答える 3

8

試す

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

または、<jQuery1.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

各ステップでインデックス値を記憶するクロージャーを使用する必要があります。これを行うための多くの可能な方法の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 に答える