親イベントjqueryを停止する

Question

こんにちは私が子リンクをクリックすると、親イベントが起動するのを止めたいです。私は「.toogleRead」をクリックすると

$('.list_row_inputtype').on('click',function(event) { 

    $(this).find('a.link_to_fire').click(); 
    event.stopPropagation(); 

    return false; 
}); 


<div class="list_row_input_type unread"> 
    <a href="#" onclick="toogleRead(); return false;" class="toogleRead"></a> 
    <a href="{corePath}/mails" class="link_to_fire">{emailLink}</a> 
    <div class="description"></div> 
</div> 

はそれが機能を発射、しかし{} corePathに変更/メールのページへ：ここでは私のコードです。私はそれがページを変更するのを防ぎたい。

Answer 1

代わりにaにclentイベントを配置できますか？イベントの伝播を心配する必要はありません。

$('.list_row_input_type.unread a.toggleRead').click(function(e) { 
    e.preventDefault(); 
    toggleRead(); 
}); 

Answer 2

イベントハンドラは、.toogleRead要素にjQueryでも追加する必要があります。ハンドラがどこにアタッチされているのかを覚えやすく、2つのやり方を混ぜ合わせず、HTMLとJavascriptの間に優れた分離を加えることができます。

実用デモhttp://jsfiddle.net/pomeh/uFV9R/です。 jQueryを使ってイベントハンドラからfalseを返す

HTMLコード

<div class="list_row_input_type unread"> 
    <a href="#" class="toogleRead"></a> 
    <a href="{corePath}/mails" class="link_to_fire">{emailLink}</a> 
    <div class="description"></div> 
</div> 

Javascriptコード

$('.list_row_input_type').on('click',function(event) { 
    event.stopPropagation(); 
    // your stuff 
}); 

$('a.toogleRead').on('click',function(event) { 
    event.stopPropagation(); 
}); 

もう一つのポイントは、ほとんどの場合、悪い習慣を考えられています。あなたが通常はそのうちの1つだけをしたいと思っている場所では、あまりにも多くのことがあります。これを詳しく説明する2つのリンクはhttp://fuelyourcoding.com/jquery-events-stop-misusing-return-false/とhttp://css-tricks.com/return-false-and-prevent-default/です。