為什么點擊span,時間冒泡只到了content,沒有繼續到body
?<h3>事件對象的屬性與方法</h3>
? ? <div class="left">
? ? ? ? <div id="content">
? ? ? ? ? ? 外層div元素
? ? ? ? ? ? <br />
? ? ? ? ? ? <span style="background: silver;">內層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>
2016-09-29
點擊span,不但觸發了span的單擊事件,而且還觸發了content的單擊事件,但是Content的單擊事件中組織了事件繼續冒泡,所以就沒再觸發content的祖父輩級對象的事件了。
2016-08-31
我知道了,因為content阻止了時間冒泡