資訊專欄INFORMATION COLUMN
摘要：事件綁定方式一用綁定事件方式二用進(jìn)行事件偵聽(tīng)，也能起到綁定事件的作用。第一個(gè)參數(shù)事件名第二個(gè)參數(shù)解綁的函數(shù)名如果是匿名函數(shù)，無(wú)法解綁。一般使用有名函數(shù)傳參。
1.事件綁定
方式一：用on綁定事件
方式二：用addEventListener進(jìn)行事件偵聽(tīng)，也能起到綁定事件的作用。
addEventListener
第一個(gè)參數(shù)：事件名
（click、mouseover...）
注意：事件名不加on
第二個(gè)參數(shù)：綁定的函數(shù)
（有名函數(shù)、匿名函數(shù)）
第三個(gè)參數(shù)：
是否捕獲
默認(rèn)值：false
可以為一個(gè)元素的同一個(gè)事件名 綁定上多個(gè)處理函數(shù)
點(diǎn)擊查看效果以及代碼，codepen中也有console可以查看
以下是完整代碼
Title
2.事件解綁
事件解綁：
(1)通過(guò)用on綁定的事件，只需要為事件 重新賦值 即可。
(2)通過(guò)addEventListener綁定的事件，需要用removeEventListener();來(lái)解綁。
第一個(gè)參數(shù)：事件名
第二個(gè)參數(shù)：解綁的函數(shù)名（如果是匿名函數(shù)，無(wú)法解綁。一般使用有名函數(shù)傳參。）
第三個(gè)參數(shù)：是否捕獲，默認(rèn)值false。
點(diǎn)擊查看事件解綁效果！?。?
以下是部分核心代碼：
3.事件流
事件流的三個(gè)階段：
（1）捕獲階段
從 最外層元素 開(kāi)始 向目標(biāo) 進(jìn)行查找的階段,
并且 同時(shí)執(zhí)行 該階段中 所有 被查找的元素 的 捕獲階段綁定的事件
（2）處于目標(biāo)階段
觸發(fā) 目標(biāo)元素的 對(duì)應(yīng)事件
（3）冒泡階段
從 目標(biāo)元素 開(kāi)始 逐漸往 外層 查找,
并且 同時(shí)執(zhí)行 該階段中 所有 被查找的元素 的 冒泡階段綁定的事件。
戳鏈接，點(diǎn)擊div查看效果?。?！
以下是全部代碼：
Title
以上代碼點(diǎn)擊黃色的結(jié)果。
4.阻止冒泡 通過(guò) on 進(jìn)行綁定
通過(guò) event.cancelBubble = true;阻止冒泡
通過(guò) addEventListener進(jìn)行綁定
通過(guò) event.stopPropagation();阻止冒泡
以上兩種其中一種，方式都可以阻止不同綁定方式的冒泡。
以下代碼可以粘貼運(yùn)行看看效果。
Title
5.瀏覽器的默認(rèn)行為
瀏覽器默認(rèn)行為
瀏覽器默認(rèn)為我們提供的功能
比如頁(yè)面跳轉(zhuǎn)，右鍵菜單，文字拖動(dòng)，圖片拖動(dòng)
阻止默認(rèn)行為
有兩種方式
（1）return false;
（2）event.preventDefault();
你好你好啊你好
百度
注意事項(xiàng)：
一般盡可能使用event.preventDefault阻止默認(rèn)樣式。因?yàn)閞eturn false；方法在jQuery中，此方法不僅會(huì)阻止默認(rèn)行為，還會(huì)阻止冒泡。相當(dāng)于同時(shí)調(diào)用了preventDefault和stopPropagation方法。6.模擬上下文菜單
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/95373.html
摘要：事件綁定方式一用綁定事件方式二用進(jìn)行事件偵聽(tīng)，也能起到綁定事件的作用。第一個(gè)參數(shù)事件名第二個(gè)參數(shù)解綁的函數(shù)名如果是匿名函數(shù)，無(wú)法解綁。一般使用有名函數(shù)傳參。 1.事件綁定 方式一：用on綁定事件 #box{ width:100px; height:100px; background-color:red; } ...
摘要：事件綁定方式一用綁定事件方式二用進(jìn)行事件偵聽(tīng)，也能起到綁定事件的作用。第一個(gè)參數(shù)事件名第二個(gè)參數(shù)解綁的函數(shù)名如果是匿名函數(shù)，無(wú)法解綁。一般使用有名函數(shù)傳參。 1.事件綁定 方式一：用on綁定事件 #box{ width:100px; height:100px; background-color:red; } ...
摘要：哪吒社區(qū)技能樹(shù)打卡打卡貼函數(shù)式接口簡(jiǎn)介領(lǐng)域優(yōu)質(zhì)創(chuàng)作者哪吒公眾號(hào)作者架構(gòu)師奮斗者掃描主頁(yè)左側(cè)二維碼，加入群聊，一起學(xué)習(xí)一起進(jìn)步歡迎點(diǎn)贊收藏留言前情提要無(wú)意間聽(tīng)到領(lǐng)導(dǎo)們的談話，現(xiàn)在公司的現(xiàn)狀是碼農(nóng)太多，但能獨(dú)立帶隊(duì)的人太少，簡(jiǎn)而言之，不缺干 ? 哪吒社區(qū)Java技能樹(shù)打卡?【打卡貼 day2...
摘要：本文將分享軟件基本用法及文件進(jìn)程注冊(cè)表查看，這是一款微軟推薦的系統(tǒng)監(jiān)視工具，功能非常強(qiáng)大可用來(lái)檢測(cè)惡意軟件?？梢詭椭褂谜邔?duì)系統(tǒng)中的任何文件注冊(cè)表操作進(jìn)行監(jiān)視和記錄，通過(guò)注冊(cè)表和文件讀寫的變化，有效幫助診斷系統(tǒng)故障或發(fā)現(xiàn)惡意軟件病毒及木馬。 ...
摘要：事件事件的定義所有的元素都有事件，我們要做的就是為事件綁定函數(shù)，當(dāng)元素發(fā)生事件時(shí)就會(huì)出發(fā)對(duì)應(yīng)的函數(shù)。當(dāng)我們沒(méi)有為事件綁定函數(shù)時(shí)，事件的值為。點(diǎn)擊事件需要注意的是事件名是，不是。鼠標(biāo)移動(dòng)事件鼠標(biāo)移動(dòng)持續(xù)觸發(fā)，當(dāng)鼠標(biāo)移出此元素上停止觸發(fā)。 1.事件 事件的定義：所有的元素都有事件，我們要做的就是為事件綁定函數(shù)，當(dāng)元素發(fā)生事件時(shí)就會(huì)出發(fā)對(duì)應(yīng)的函數(shù)。當(dāng)我們沒(méi)有為事件綁定函數(shù)時(shí)，事件的值為nul...
閱讀 510·2023-04-25 17:26
閱讀 1526·2021-08-05 09:58
閱讀 1989·2019-08-30 13:17
閱讀 978·2019-08-28 17:52
閱讀 1088·2019-08-26 18:27
閱讀 1438·2019-08-26 14:05
閱讀 3645·2019-08-26 14:05
閱讀 1621·2019-08-26 10:45
