五月综合缴情婷婷六月,色94色欧美sute亚洲线路二,日韩制服国产精品一区,色噜噜一区二区三区,香港三级午夜理伦三级三

您現(xiàn)在的位置: 365建站網(wǎng) > 365文章 > 解決/阻止 div層內(nèi)的div底層點(diǎn)擊事件冒泡觸發(fā)的方法

解決/阻止 div層內(nèi)的div底層點(diǎn)擊事件冒泡觸發(fā)的方法

文章來源:365jz.com     點(diǎn)擊數(shù):2286    更新時(shí)間:2018-09-12 18:40   參與評(píng)論

   有天,同事問我,有一個(gè)div層'out',內(nèi)含有一個(gè)div層'in'。如下:

20151025210955758.jpg


       兩個(gè)層都綁定了點(diǎn)擊事件,但是點(diǎn)擊in層的時(shí)候,同時(shí)也會(huì)觸發(fā)out層的點(diǎn)擊事件。但是他并不希望觸發(fā)out的點(diǎn)擊事件,只希望觸發(fā)in層的點(diǎn)擊事件,問我怎么處理。頁(yè)面代碼:

  1. <div style="width: 400px;height: 400px;background-color: #678678;font:3em bold;" id="outDiv">
    out
    <div style="width: 200px;height: 200px;margin: 50px;background-color: #eaceac;font:1em bold;" id="inDiv">in</div>
    </div>


關(guān)于如何取消事件冒泡的方法。才算是比較靠譜的解決了這個(gè)問題,代碼如下:


inDiv.addEventListener('click',function(e){
                alert('in');
                e.stopPropagation();//終止事件冒泡
            },false);
            outDiv.addEventListener('click',function(e){
                alert('out');
            },false);



另外outclick 點(diǎn)擊div外部觸發(fā)事件


$(".div").click(function(event){  

    event=event||window.event;  

    event.stopPropagation();  

});  

  

//點(diǎn)擊層外,隱藏這個(gè)層。由于層內(nèi)的事件停止了冒泡,所以不會(huì)觸發(fā)這個(gè)事件  

$(document).click(function(e){                       

    $(".div").hide();  

});  


如對(duì)本文有疑問,請(qǐng)?zhí)峤坏浇涣髡搲?,廣大熱心網(wǎng)友會(huì)為你解答??! 點(diǎn)擊進(jìn)入論壇

發(fā)表評(píng)論 (2286人查看,0條評(píng)論)
請(qǐng)自覺遵守互聯(lián)網(wǎng)相關(guān)的政策法規(guī),嚴(yán)禁發(fā)布色情、暴力、反動(dòng)的言論。
昵稱:
最新評(píng)論
------分隔線----------------------------

其它欄目

· 建站教程
· 365學(xué)習(xí)

業(yè)務(wù)咨詢

· 技術(shù)支持
· 服務(wù)時(shí)間:9:00-18:00
365建站網(wǎng)二維碼

Powered by 365建站網(wǎng) RSS地圖 HTML地圖

copyright © 2013-2024 版權(quán)所有 鄂ICP備17013400號(hào)