jqueryの、親要素のonclick = window.locationのを防ぐ

Question

私はこのようなデータを持つテーブルがある：

<table> 
<tr onclick="window.location='download.php?id=1'"> 
    <td>Program 1<br/>Short Description 1 (<a onclick="$.popup.show('Install Instructions', 'Instructions pulled from DB here')">Instructions</a>)</td> 
    <td>Added by user and date/time here<td> 
    <td>Filesize here<td> 
    <td><a href="edit.php?id=1">Edit</a> - <a href="delete.php?id=1">Delete</a><td> 
</tr> 
(repeat TRs for more programs pulled from DB) 
</table> 

私がいる問題があります（取扱説明書）のリンクをクリックしたときに、それがなければならないこと指示があるウィンドウをポップアップします。それはしますが、TRのonclickも起動します。だから私は分裂のためのポップアップを取得し、それはdownload.phpに行く。

TRのオンクリックを放つのを防ぐことができますか？ jqueryを使用することをお勧めしますが、私はプレーンなJavaScriptソリューションも気にしません。

Answer 1

基本的には、event.cancelBubble（IEの場合）またはevent.stopPropagation（）（他のすべての場合）を使用してpropagation of eventsを停止する必要があります。

<script type="text/javascript"> 
var instructions = function(e) { 
    // Get the correct event in a cross-browser manner, then stop bubbling/propagation. 
    if (!e) var e = window.event; 
    e.cancelBubble = true; 
    if (e.stopPropagation) e.stopPropagation(); 

    // Do what you want now 
    $.popup.show('Install Instructions', 'Instructions pulled from DB here'); 
} 
</script> 

その後、スクリプトがそれを呼び出します：：（私は前に使ってきた）solution given from quirksmodeはこのような何かを行うことです

<td>Program 1<br/>Short Description 1 (<a onclick="instructions(event)">Instructions</a>)</td> 

（もちろん、あなたがこのすべてのインラインを置くことができるが、しかし、それは血まみれの混乱です。）

this questionイルミネーションがあります。

Answer 2

stopPropogationは必要なものです。

http://docs.jquery.com/Events/jQuery.Event#event.stopPropagation.28.29

Answer 3

あなたは

onclick="false" 

を書くことができますし、（他のブラウザにIEやaddEventListenerをして​​attachEvent）イベントモデルのレベル2を使用してイベントを追加します。 jqueryを使用する場合、jqueryバインド（「クリック」）することもできます。