複数の要素に適用されたときに、単一の要素に対してsetIntervalをクリアするにはどうすればよいですか？

Question

私はsetIntervalが適用された複数のアイテムを持っています。私はclearIntervalを持っていて、ホバー上でアニメーションを停止します。もちろん、アニメーション化するアイテムはすべて停止します。私は、ホバリングされたアイテムだけの間隔をクリアし、他の人がアニメーションを続けることを許可したい。私は、アニメーションが互いに同期していなくても問題ありません。

var boxInterval = setInterval(startBox, 3000); 

$('.box').mouseenter(function(){ 
    clearInterval(boxInterval); 
}); 

$('.box').mouseleave(function(){ 
    boxInterval = setInterval(startBox, 3000); 
}); 

jsfiddle：1の上に浮かんで通知が他を一時停止します。ホバリングオフ（2秒後）

Answer 1

setTimeout/setIntervalから返された参照は要素に関連付けられていません。それぞれの参照を一意に保存する必要があります。私は、私は2つのイベントは、常にペアでトリガので、各項目についてboxIntervalを保存していると思う... .data()プロパティで

$('.box').mouseenter(function(){ 
    clearInterval($(this).data('timer')); 
}); 

$('.box').mouseleave(function(){ 
    $(this).data('timer', setInterval(startBox, 3000)); 
}); 

Answer 2

に行くと思います。