0


どうすればこのようなものを手に入れることができますか：

<input class="myClass" id="a" type="checkbox" other="x"/>
<input class="myClass" id="b" type="checkbox" other="x"/>
<input class="myClass" id="c" type="checkbox" other="x"/>
<input class="myClass" id="d" type="checkbox" other="y"/>
<input class="myClass" id="e" type="checkbox" other="z"/>

other要素aからeを取得し、クリックイベントを追加し、属性（x、y、z）で定義された要素にイベントを追加したいと思います。
どうすればいいですか？
私は試してみます：

$(".myClass").each( function() {
    $("#" + $(this).attr("other")).click( function() {
        ...
    });
});

しかし、3つの要素がother="x"あるので、イベントはxに3回追加され、1つだけが必要です。

4

2 に答える 2

1

これを試してください。新しいイベントをバインドする前に、イベントのバインドを解除します。JsFiddle のデモ

$(".myClass").each( function() {
    $("#" + $(this).attr("other")).unbind('click').click(    function() {
       alert(this.id);
    });
});
于 2012-05-29T10:19:50.180 に答える
1

より良い方法があるかもしれませんが、名前空間[docs]を使用して、このタイプの以前のイベント ハンドラーをバインド解除できます。

$(".myClass").each( function() {
    $("#" + $(this).attr("other")).off('click.someNS').on('click.someNS', function() {
        ...
    });
});

other別の方法は、特定の属性を持つ要素を 1 つだけ持つように要素をフィルター処理することです。

var seen = {};

$(".myClass").filter(function() {
    var other = $(this).attr('other');
    return !seen[other] && (seen[other] = true);
}).each(...);
于 2012-05-29T10:20:34.740 に答える