2016-11-08 7 views
2

同じクラス名を持つ複数のdivがありますが、同じクラスを持つ別のものが再びクリックされたときに再び機能することは望ましくありません。複数のクラスで.one()を使用

$('.js-item').one("click", function() { 
    console.log('clicked once'); 
    // do something only once even if a div with the same class is clicked again 
}); 

.one()一度だけ、すべての私のクラスで発生するための方法はありますか?現時点では一度だけ適用されますが、そのクラス名を持つ個々のdivがクリックされるたびに適用されます。

同じクラス名を使用するには、これらのdivが必要です。ご希望の場合は、標準on()に戻すことができますので、この方法を使用

$('.js-item').one("click", function() { 
 
    console.log('clicked once'); 
 

 
    // do something only once even if a div with the same class is clicked again 
 

 
    $('.js-item').off('click'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="js-item">click me!</div> 
 
<div class="js-item">click me!</div> 
 
<div class="js-item">click me!</div> 
 
<div class="js-item">click me!</div> 
 
<div class="js-item">click me!</div>

one()が冗長になり:

答えて

2

あなたのロジックを実行した後、すべてのそれらのクラスにoff()を呼び出すことができます。

+0

ありがとうございました、時間が経ってから受け入れられた答えとして入れます –

0
$('.js-item').on("click", function() { 
    var $this = $(this); 
    $('.js-item').removeClass('classAdded'); 
    $this.addClass('classAdded'); 
}); 

あなたはこのようにすることができます。

+1

これはOPが必要とすることをしません。デフォルトの動作とイベントがDOMをバブリングするのを止めるだけです。複数の '.js-item'要素をクリックしてイベントハンドラを実行させることを止めません –

関連する問題