事件冒泡的概念及阻止事件冒泡-相容性寫法
36事件冒泡和捕獲-相容性寫法
一、什麼是事件冒泡
一條魚往上吐泡泡,這個泡泡就是事件,一直往上冒的過程中去把它經過的所有元素,只要這個元素身上有相同事件,就會去執行該元素的該事件,沒有相同事件就不會去執行
二、冒泡特點
1、冒泡看的是程式碼層級,從裡往外冒泡
2、擁有相同型別事件的元素才會被執行
3.不同事件就是不同泡泡
三、阻止事件冒泡
並不是所有事件都需要事件冒泡,我們需要讓事件執行完自身的該事件後,不再往上冒,這就是阻止事件冒泡
obj為當前執行該事件的元素物件
obj.onclick=function(e){ e=e||window.event //event事件的相容性寫法 if(e.stopPropagation){ //能進來一定是支援該方法 e.stopPropagation(); //在主流瀏覽器中阻止 }else{ e,cancelBnbble=true//true為阻止冒泡 } }
相關推薦
事件冒泡的概念及阻止事件冒泡-相容性寫法
36事件冒泡和捕獲-相容性寫法 一、什麼是事件冒泡 一條魚往上吐泡泡,這個泡泡就是事件,一直往上冒的過程中去把它經過的所有元素,只要這個元素身上有相同事件,就會去執行該元素的該事件,沒有相同事件就不會去執行 二、冒泡特點 1、冒泡看的是程式碼層級,從裡往外冒泡 2、擁有相同型別事件的元素
事件流--事件冒泡現象及阻止
fun bsp clas back cancel com ati red i++ 事件冒泡現象 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-
冒泡與捕獲,事件繫結,阻止事件冒泡,阻止預設行為
Internet Explorer 8 及更早IE版本不支援 addEventListener() 方法,Opera 7.0 及 Opera 更早版本也不支援。 但是,對於這些不支援該函式的瀏覽器,你可以使用 attachEvent() 方法來新增事件控制代碼。對於事件繫結相
HTML事件冒泡和JQuery阻止事件冒泡的方式
何為事件冒泡: HTML DOM模型是個樹形結構,元素之間有相互巢狀的關係,比如<div><a href="new_url">Click Me</a> </div>中div是父元素而a是子元素。如果父子元素都綁定了同一個事件比
js阻止取消冒泡和阻止預設行為(相容性寫法)
取消冒泡相容性寫法 function canclebubble(event){ var event = event||window.event; //相容火狐 if(
W3C事件與IE事件的區別及預設事件的阻止
在瀏覽器解析事件的時候,有兩種觸發方式,一種叫做Bubbling(冒泡),另外一種叫做Capturing(捕獲)。冒泡的方式效果就是當一個DOM元素的某事件例如click事件被f觸發
阻止事件冒泡及預設行為
為使點選當前元素,只執行當前所點選元素的特定操作,可以使用阻止冒泡或者阻止預設行為。 1、阻止預設行為。preventDefault() <!DOCTYPE html> <html lang="en"> &l
詳解javascript如何阻止冒泡事件及阻止預設事件
在說事件冒泡之前,我們先說說事件物件(Event) Event 1、在觸發DOM上某個事件時,會產生一個事件物件event,這個物件包含著所有事件有關的資訊(導致事件的元素、事件的型別、與特定事件相關的資訊) 2、所有瀏覽器都支援Event物件,但支
jQuery中阻止事件冒泡的方式及區別
方法一:event.stopPropagation(); $("#div").mousedown(function(event){ event.stopPropagation(); }); 方法二:return false; $("#di
js 相容性之阻止事件冒泡傳遞
有時候在document.onclick上綁定了事件,但在單擊某些地方的時候不希望觸發document上的click事件,則可以在方法裡阻止其事件的冒泡,例如: var btn = document.getElementById("btn"); btn.onclick=fun
jquery阻止事件冒泡及解決辦法 live
動態新增標籤的live事件 注:jquery版本1.8之後不在支援live事件 在實際專案中遇到的問題,動態新增的標籤 live阻止冒泡失效,無論是用return false還是用e.s
阻止事件冒泡
itl opp elf prop logs script rand col 事件冒泡 <!doctype html> <html> <head> <title></title> <meta
JQuery中阻止事件冒泡方式及其區別
use urn query class span 事件冒泡 事件 clas nbsp 方式一:event.stopPropagation(); 1 $("#div1").mousedown(function(event){ 2 event.stopPropa
阻止事件冒泡傳播,點擊包含點擊
cti 包含 opp oca ppr || cat window tin function stopBubbling(e) { e = window.event || e; if (e.stopPropagatio
js阻止事件冒泡的兩種方法
type print mil opp name sel code read lib 一、冒泡事件簡介 當我們點擊一個控件的時候,如果包括這個控件的父控件也有click事件,則會繼續執行。 方法一:event.stopPropagation( ); 例如: <div
阻止事件冒泡和事件默認行為
pre function 防止 處理 true 停止 jquery 事件 val 阻止事件冒泡(兼容IE8) function stopHandler(event){ window.event?window.event.cancelBubble=true:even
javascript阻止事件冒泡和瀏覽器的默認行為
pre stop key else can put 事件冒泡 prop top 1.阻止事件冒泡,使成為捕獲型事件觸發機制. 1 function stopBubble(e) { 2 //如果提供了事件對象,則這是一個非IE瀏覽器 3 if ( e &&
AngularJs 阻止事件運行,防止冒泡穿透事件
blog pro 運行 logs prop 事件 opp () on() ng-click 低啊用方法後 添加語句$event.stopPropagation(); <button type="button" ng-click="doSomeSth();$e
jq+mui 阻止事件冒泡
ble span link cti sca con styles body blog 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF
javascript如何阻止事件冒泡和默認行為
demo log 執行順序 ng- 16px capital win 秘密 mir 阻止冒泡: 冒泡簡單的舉例來說,兒子知道了一個秘密消息,它告訴了爸爸,爸爸知道了又告訴了爺爺,一級級傳遞從而以引起事件的混亂,而阻止冒泡就是不讓兒子告訴爸爸,爸爸自然不會告訴爺爺。下面的