JavaScript 事件的冒泡問題
事件冒泡主要是指:
多個元素嵌套,有層次關系,這些元素都註冊了相同的事件,如果裏面的元素的事件觸發了則外面元素的事件也會依層觸發
阻止事件冒泡 的主要方法
window.event.cancelBubble() 火狐不支持,IE、谷歌支持
onclick=function (e) { console.log(this.id); //阻止事件冒泡 e.stopPropagation(); // 火狐,谷歌支持,IE8不支持 };
事件主要的三個階段:
1.事件的捕獲階段 從外往內
2.事件的目標階段 選擇的那個
3.事件的冒泡階段 從內往外
JavaScript 事件的冒泡問題
相關推薦
javascript-事件冒泡、鼠標跟隨、鍵盤跟隨、鍵盤提交
事件冒泡、鼠標跟隨、鍵盤跟隨、鍵盤提交1、事件冒泡<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title>
javascript事件冒泡
performed index 分析 事情 過程 lis eve num 輸出 1. 事件 在瀏覽器客戶端應用平臺,基本生都是以事件驅動的,即某個事件發生,然後做出相應的動作。 瀏覽器的事件表示的是某些事情發生的信號。事件的闡述不是本文的
javascript 事件冒泡處理方式
在工作中遇到 javascript 冒泡的情況,特此記錄一下。我們要實現點選包含此課程vip上面的區域進行關閉視窗也就是div的隱藏,點選 包含此課程vip 以下的區域不進行關閉視窗,實際效果是下面的點選也會關閉視窗。 下圖是html頁面結構的程式碼, 其
JavaScript 事件冒泡和事件捕捉
含義 事件冒泡 事件的觸發順序為,由內而外。直到文件最頂層(document或window)。 事件捕捉 事件的觸發順序為,由外而內。 任何發生在w3c事件模型中的事件,首是進入捕獲階段,直到達到目標元素,再進入冒泡階段。 //使用事件捕捉模式 element1.
JavaScript 事件冒泡/事件捕獲/事件委託
事件處理機制:IE 、opera 是事件冒泡,火狐是事件捕獲 事件冒泡 事件從事件目標(target)開始,往上冒泡直到頁面的最上一級標籤 事件捕獲 事件從最上一級標籤開始往下查詢,直到捕獲到事件目標(target) 事件由父元素向子元素傳播
JavaScript事件冒泡簡介及應用
一、什麼是事件冒泡 在一個物件上觸發某類事件(比如單擊onclick事件),如果此物件定義了此事件的處理程式,那麼此事件就會呼叫這個處理程式,如果沒有定義此事件處理程式或者事件返回true,那麼這個事件會向這個物件的父級物件傳播,從裡到外,直至它被處理(父級物件
深入理解JavaScript事件冒泡
一、什麼是事件冒泡 在一個物件上觸發某類事件(比如單擊onclick事件),如果此物件定義了此事件的處理程式,那麼此事件就會呼叫這個處理程式,如果沒有定義此事件處理程式或者事件返回true,那麼這個事件會向這個物件的父級物件傳播,從裡到外,直至它被處理(父級物件所有同類
JavaScript事件冒泡,事件捕獲,事件處理,事件委託
早期的事件,是作為分擔伺服器運算負載的一種手段,實文件或者瀏覽器視窗中發生的一些特定的互動瞬間,如點選按鈕,拖放檔案等。我們可以使用偵聽器來預定事件,當事件釋出時候就可作出相應的響應,這種模式稱為觀察者模型。 事件流 事件流是從頁面接收事件的順序。在一個html頁面中,
JavaScript 事件冒泡機制
html的DOM是層級包含關係的,比如巢狀的DIV,如果三個DIV都綁定了事件的話,最內層的DIV的事件觸發會導致父級DIV所繫結的事件的觸發,就像湖水裡面底層的氣泡在從底部到湖面會觸發各個深度的事件一樣。html的DOM的這種機制有時候會給我們帶來麻煩,因為
javascript阻止事件冒泡和瀏覽器的默認行為
pre stop key else can put 事件冒泡 prop top 1.阻止事件冒泡,使成為捕獲型事件觸發機制. 1 function stopBubble(e) { 2 //如果提供了事件對象,則這是一個非IE瀏覽器 3 if ( e &&
JavaScript阻止冒泡和取消事件默認行為
阻止冒泡 ble opp prop bubble script als spa rop //功能:停止事件冒泡 function stopBubble(e) { if ( e && e.stopPropagation ) {
JavaScript--事件委托--冒泡
-- order case click pointer list win logs document <!DOCTYPE html> <html lang="en"> <head> <meta charset="U
javascript如何阻止事件冒泡和默認行為
demo log 執行順序 ng- 16px capital win 秘密 mir 阻止冒泡: 冒泡簡單的舉例來說,兒子知道了一個秘密消息,它告訴了爸爸,爸爸知道了又告訴了爺爺,一級級傳遞從而以引起事件的混亂,而阻止冒泡就是不讓兒子告訴爸爸,爸爸自然不會告訴爺爺。下面的
前端(十五)—— JavaScript事件:繫結事件方式、事件的冒泡和預設事件、滑鼠事件、鍵盤事件、表單 事件、文件事件、圖片事件、頁面事件
JS事件:繫結事件方式、事件的冒泡和預設事件、滑鼠事件、鍵盤事件、表單 事件、文件事件、圖片事件、頁面事件 一、事件的兩種繫結方式 ******* 1、on事件繫結方式 document.onclick = function() { console.log("文件點選"); } // on事件只
JavaScript 事件的冒泡問題
window 註冊 火狐 支持 ava javascrip bubble clas pre 事件冒泡主要是指: 多個元素嵌套,有層次關系,這些元素都註冊了相同的事件,如果裏面的元素的事件觸發了則外面元素的事件也會依層觸發 阻止事件冒泡 的主要方法 window
javascript能冒泡的事件
每個 event 都有一個event.bubbles屬性,可以知道它可否冒泡。(ref:W3定義的Event Interface) 當然 W3 DOM Level 3 Events 的細則裡已經附上這個表格了: Event Type Bubbling pha
javascript阻止事件冒泡
我要分享 有些情況下,事件冒泡是人為設定的,但是大多數情況下,冒泡需要禁止! 1)IE核心瀏覽器下: window.event.cancelBubble = true; 2)W3C核心瀏覽器下: dom物件.事件 = function(event) { eve
javascript之事件捕獲和事件冒泡
1. 事件階段 事件分為三個階段:捕獲階段、目標階段和冒泡階段。 捕獲階段: 事件從文件的根節點流向目標物件節點。途中經過各個層次的DOM節點,並在各節點上觸發捕獲事件,直到到達事件的目標節
JavaScript中冒泡與事件委託
冒泡 事件觸發後事件流的三個階段按順序依次是: 1、捕獲階段 2、目標階段 3、冒泡階段 大盒子包裹小盒子,兩個盒子都分別新增點選事件,當點選小盒子,兩個盒子的事件都會觸發。 事件委託 下
JavaScript中冒泡與事件委托
目標 var color ace 函數 prevent 阻止默認行為 tor 事件委托 冒泡 事件觸發後事件流的三個階段按順序依次是: 1、捕獲階段 2、目標階段 3、冒泡階段 大盒子包裹小盒子,兩個盒子都分別添加點擊事件,當點擊小盒