0

だから私は灰色の背景の長方形を持つ H3 を持っています。その灰色の背景のどこかをクリックすると、特定の div が slideToggle() を実行します。これはうまくいきます。

さて、その H3 内には、何かを行う jquery 関数を呼び出すリンクもあります。それもうまくいきます。

しかし、私の問題はこれです。リンクは H3 内にあるため、その関数が実行された後、H3 内のどこかをクリックしたため、slideToggle() も実行されます。

問題は、リンクをクリックしたときに slideToggle() が発生しないようにするにはどうすればよいかということです。フラグを使用できると思いますが、もっとエレガントな方法があることを願っています。

どんな助けでも大歓迎です。

HTMLコード

<h3 id="data_id"> 
    <a href="#" id="random_id" >Random</a>   
</h3>

<div id="data_div_id">
    // The data here is irrelevant to the issue at hand
</div>

Jquery コード

$('#data_id').click(function() {   
    $('#data_div_id').slideToggle('slow');      
}); 

$('#random_id').click(function(event) {
    // it does something irrelevant to the issue at hand
});
4

2 に答える 2

3

event.stopPropagation()を使用して、イベントのバブリングを停止できます。

ここでjsFiddle。

$('#data_id').click(function() {   
    $('#data_div_id').slideToggle('slow');      
}); 

$('#random_id').click(function(event) {
    event.stopPropagation();
});
于 2013-04-25T15:27:50.353 に答える