兼容各大瀏覽器的JavaScript阻止事件冒泡代碼
更新時(shí)間：2015年07月09日 09:21:42 投稿：hebedich
本文給大家分享的是一段兼容各大瀏覽器的JavaScript阻止事件冒泡代碼，雖然因?yàn)闀r(shí)間問題沒有深入研究，但是還是相當(dāng)不錯(cuò)的，這里推薦給大家
這里僅僅是一個(gè)簡單代碼demo，因?yàn)闀r(shí)間問題并未做深入研究，因?yàn)榻裉熳鲰?xiàng)目時(shí)要用到阻止事件冒泡的內(nèi)容，找了好多才找到一個(gè)可以使用的，特記錄之。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>阻止事件冒泡</title>
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/jquery.cookie.js"></script>
<style type="text/css">
</style>
<script type="text/javascript">
function clickDiv(){
alert("clickDiv");
}
function clickP(event){
stopEvent(event);
alert("clickP");
}
function stopEvent(event){ //阻止冒泡事件
//取消事件冒泡
var e=arguments.callee.caller.arguments[0]||event; //若省略此句，下面的e改為event，IE運(yùn)行可以，但是其他瀏覽器就不兼容
if (e && e.stopPropagation) {
// this code is for Mozilla and Opera
e.stopPropagation();
} else if (window.event) {
// this code is for IE
window.event.cancelBubble = true;
}
}
</script>
</head>
<body>
<div onclick="clickDiv()" style="width:100px; height:100px; background-color:red;">
<p onclick="clickP(event)" style="width:50px; height:50px; margin:auto; background-color:green;">
abad
</p>
</div>
<script type="text/javascript">
</script>
</body>
</html>
以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡。
相關(guān)文章
驗(yàn)證javascript中Object和Function的關(guān)系的三段簡單代碼
今天重溫經(jīng)典書籍。這一次看的是博客園李戰(zhàn)老師寫的<<悟透JavaScript>>，也是被樓豬翻看最多的技術(shù)書籍之一。2010-06-06
分享12個(gè)Webpack中常用的Loader(小結(jié))
這篇文章主要介紹了分享12個(gè)Webpack中常用的Loader(小結(jié))，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
以前我們說的內(nèi)存泄漏，通常發(fā)生在后端，但是不代表前端就不會(huì)有內(nèi)存泄漏。特別是當(dāng)前端項(xiàng)目變得越來越復(fù)雜后，前端也逐漸稱為內(nèi)存泄漏的高發(fā)區(qū)。本文就帶大家了解一下Javascript的內(nèi)存泄漏2022-06-06
javascript 自動(dòng)轉(zhuǎn)到命名錨記
javascript 自動(dòng)轉(zhuǎn)到命名錨記,方面業(yè)內(nèi)控制導(dǎo)航等信息2009-01-01
js與jquery正則驗(yàn)證電子郵箱、手機(jī)號(hào)、郵政編碼的方法
這篇文章主要介紹了js與jquery正則驗(yàn)證電子郵箱、手機(jī)號(hào)、郵政編碼的方法,涉及javascript與jQuery鼠標(biāo)事件的響應(yīng)與正則驗(yàn)證操作字符串的相關(guān)技巧,需要的朋友可以參考下2016-07-07
本篇文章主要介紹了JavaScript中捕獲/阻止捕獲、冒泡/阻止冒泡方法，具有一定的參考價(jià)值，有興趣的可以了解一下。2016-12-12
javascript實(shí)現(xiàn)計(jì)算器功能
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)計(jì)算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-03-03
這篇文章主要為大家詳細(xì)介紹了微信小程序工具函數(shù)封裝，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10
js中編碼函數(shù)：escape,encodeURI與encodeURIComponent詳解
escape(), encodeURI()和encodeURIComponent()是在Javascript中用于編碼字符串的三個(gè)常用的方法，而他們之間的異同卻困擾了很多的Javascript初學(xué)者，這篇文章詳細(xì)的給大家介紹了js中編碼函數(shù)：escape,encodeURI與encodeURIComponent的相關(guān)資料，需要的朋友可以參考下。2017-03-03
詳解JavaScript中的Unescape()和String() 函數(shù)
這篇文章主要介紹了詳解JavaScript中的unescape()和String() 函數(shù)，JavaScript unescape() 函數(shù)可對(duì)通過 escape() 編碼的字符串進(jìn)行解碼，String() 函數(shù)把對(duì)象的值轉(zhuǎn)換為字符串，對(duì)本文感興趣的朋友一起學(xué)習(xí)吧2015-11-11