3

私の質問はこれに関連しています: 複数の要素に対するjQueryの同じクリックイベント

しかし、私がするとき：

$('.class1, .class2').click(function() {
   some_function();
});

私は常に同じオブジェクトで同じ関数を使用します。たとえば、次の 2 つのステートメントを統合したい場合はどうなるでしょうか。

$(".class1").click(function () {
  $(".classer1").slideToggle("slow");
});

$(".class2").click(function () {
  $(".classer2").slideToggle("slow");
});

それらはそれぞれに異なるオブジェクトを参照しています - これを統合することはできますか?

ありがとう、オリバー

4

5 に答える 5

5

あなたはこれを行うことができます：

$(".class1, .class2").click(function () {
  $(".classer"+$(this).attr('class').substr(-1)).slideToggle("slow");
});

クリックしている要素のクラスが 1 つだけである限り。これにより、クリックされている要素から整数が取り出され、 に追加され.classerます。したがって、 をクリックする.class2と、 のトグルがトリガーされ.classer2ます。

于 2013-03-20T21:17:34.563 に答える
2

これを行う最善の方法は、各クラスに使用している参照番号にデータ属性を追加することだと思います。

<div class="class1" data-ref-id="1"></div>

と

<div class="class2" data-ref-id="2"></div>

次のように、参照されているトグル クラスを見つけることができます。

$('.class1, .class2').click(function (e) {
    $('.' + NAME_OF_REFERENCED_TOGGLE_CLASS + this.data.refId).slideToggle('slow');
})
于 2013-03-20T21:14:45.057 に答える
2

add()を見てみることをお勧めします。これを使用して、セレクターを選択スタックに追加します。次のように使用します。

$('.class1').add('.class2').click(function (e) {
    // Do whatever you want
})
于 2013-03-20T21:17:45.603 に答える
2 
<div class='common-class' data-id='1'></div>

$('.common-class').on('click', function() {
    if ($(this).data('id')) { 
        $(".classer" + $(this).data('id')).slideToggle("slow");
    }
});
于 2013-03-20T21:18:10.487 に答える
1

html によっては、要素の場所に基づいて選択する方がよい場合があります。たとえば、これが html の場合:

<dl class="class1 list">
    <dt>Foo</dt>
    <dd>Foobar</dd>
    <dt>Dog</dt>
    <dd>Pitbull</dd>
</dl>
<dl class="class2 list">
    <dt>Foo</dt>
    <dd>Foobar</dd>
    <dt>Dog</dt>
    <dd>Pitbull</dd>
</dl>

あなたが使用することができます：

$(".list dt").click(function(){
    $(this).next("dd").slideToggle();
});

シングルクリックイベントで両方のリストを処理します。

于 2013-03-20T21:23:22.603 に答える