event.cancelBubble = true e.stopPropagation()イベント処理をキャンセルし、イベントをブロックします



Event Cancelbubble True E



接続する

上記のように、trをクリックすると、別のページにジャンプします。



<tr style='cursor:pointer' onmouseover='this.style.backgroundColor='gainsboro'' onmouseout='this.style.backgroundColor=''' onclick='return Click()'>

function Click() {



window.location.href = 'xxx'

}

接続する に変更することができます 接続する



これにより、タグをクリックしているときに別のページにジャンプすることを回避できます。 Onclick = 'event.cancelBubble = true'はイベント処理をキャンセルします。

それ以外の場合は、をクリックすると別のページにジャンプします。

分析:

イベントのバブリングをキャンセルします。 IEのイベントメカニズムでは、トリガーイベントは子要素から親要素に段階的にアップロードされます。つまり、子要素がクリックイベントをトリガーすると、親要素イベントのクリックイベントもトリガーされます。 cancelBubble = trueは、イベントを停止してアップロードを続行できます

さらに、Ieのイベント配信は下から上に行われます。

イベントソースオブジェクト->上部オブジェクト->上部オブジェクト-> .....->本体->ドキュメント->ウィンドウ

NSイベントの配信は上から下へです。

window-> document-> body-> ....->イベントソースオブジェクト

(event.returnValue = falseは、イベントの戻り値をfalseに設定します。つまり、イベント処理をキャンセルします)

2、2つのイベントの違い

e.cancelBubble=true// ie block bubbling

e.stopPropagation()// Block bubbling under other browsers

伝播を停止するトーンはよりフォーマルで深刻です。意味は「拡散を停止する」です。
バブルをキャンセルトーンはより口語的で、チャットと同様に、無料の翻訳は「バブリングをキャンセル」です。つまり、ゴシップをしないでください。

実際、IEがW3C標準に準拠しているので、両方のイベントでイベントのバブリングを防ぐことができます。

私は実際の仕事で以下を使用します。

/ / Directly written in HTML Print //written in js {$vo.billcode} function td_click(obj,ev){ layer.open({ Title: 'View details', type: 2, area: ['800px', '650px'], fix: true, maxmin: false, content: $(obj).data('myhref'),offset: '100px' }) var e=(ev)?ev:window.event if (window.event) { e.cancelBubble=true// ie under } else { e.stopPropagation()// Other browsers } }