亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

為什么body的點擊事件只有id=msg的那個div里面能觸發,body不是包含住整個頁面嗎

<!DOCTYPE html>

<html>


<head>

? ? <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

? ? <title></title>

? ? <style>

? ? body{

? ? ? ? background:green;

? ? ? ? }

? ? .left div,

? ? .right div {

? ? ? ? width: 500px;

? ? ? ? height: 100px;

? ? ? ? padding: 5px;

? ? ? ? margin: 5px;

? ? ? ? float: left;

? ? ? ? border: 1px solid #ccc;

? ? }

? ??

? ? .left div {

? ? ? ? background: #bbffaa;

? ? }

? ??

? ? .right div {

? ? ? ? background: yellow;

? ? }

? ? </style>

? ? <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>

</head>


<body>

? ? <h3>事件對象的屬性與方法</h3>

? ? <div class="left">

? ? ? ? <div id="content">

? ? ? ? ? ? 外層div元素

? ? ? ? ? ? <br />

? ? ? ? ? ? <span style="background: green;">內層span元素</span>

? ? ? ? ? ? <br /> 外層div元素

? ? ? ? </div>

? ? ? ? <br />

? ? ? ? <div id="msg"></div>

? ? </div>

? ? <script type="text/javascript">

? ? //為 <span> 元素綁定 click 事件 ?

? ? $("span").click(function() {

? ? ? ? $("#msg").html($("#msg").html() + "<p>內層span元素被單擊</p>");

? ? });

? ? //為 Id 為 content 的 <div> 元素綁定 click 事件 ?

? ? $("#content").click(function(event) {

? ? ? ? $("#msg").html($("#msg").html() + "<p>外層div元素被單擊</p>");

? ? ? ? event.stopPropagation(); //阻止事件冒泡 ?

? ? });

? ? //為 <body> 元素綁定 click 事件 ?

? ? $("body").click(function() {

? ? ? ? $("#msg").html($("#msg").html() + "<p>body元素被單擊</p>");

? ? });

? ? </script>

</body>


</html>


正在回答

4 回答

因為 ?第49行代碼?event.stopPropagation(); //阻止事件冒泡 ?

Id 為 content 的<div>在觸發 click 事件后是不會冒泡的,因此傳播到?<body> 節點,所以運行結果為“外層div元素被單擊”,同理,如果內層span元素被單擊,結果顯示為(1)“內層span元素被單擊”(2)“外層div元素被單擊”,第二個結果是由于span冒泡產生的,但由于?<div id="content">阻止了事件冒泡,所以冒泡就停留在了這層,不會繼續下去到body了。

1 回復 有任何疑惑可以回復我~
#1

我不是林俊杰 提問者

非常感謝!
2016-11-04 回復 有任何疑惑可以回復我~

最佳答案和提問者是刷積分的嗎?

提問問的body點擊事件為什么點擊頁面沒有觸發,

最佳答案回答的Id 為 content 的 <div>的點擊事件的阻止冒泡事件。

最佳答案的這個阻止冒泡事件是全場通用的超級阻止冒泡事件嗎?函數體內一次聲明,全場全時段有效?!

0 回復 有任何疑惑可以回復我~

css設置中div浮動了,你給body加一個boder邊框,就知道body的范圍了,其實是比div小,點擊body是有觸發函數的

0 回復 有任何疑惑可以回復我~

大神,能解答一下:瀏覽器的默認行為有哪些?有哪些事件可以觸發瀏覽器的默認行為?

0 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消

為什么body的點擊事件只有id=msg的那個div里面能觸發,body不是包含住整個頁面嗎

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號