請(qǐng)教關(guān)于jquery阻止冒泡的問(wèn)題？
問(wèn)題描述
如圖，我有一個(gè)彈窗想點(diǎn)擊除輪播區(qū)域外的地方關(guān)閉彈窗，點(diǎn)擊切換按鈕實(shí)現(xiàn)切換圖片
代碼如下
$('.cut-model').bind('click',function(e){ $(this).hide();//點(diǎn)擊空白區(qū)域關(guān)閉彈窗})$('.round').bind('click',function(e){ e.stopPropagation();//點(diǎn)擊切換按鈕阻止冒泡})
然而。。。。并沒(méi)有成功，點(diǎn)擊切換按鈕時(shí)彈窗仍然關(guān)閉，請(qǐng)教各位大神是什么原因，我寫(xiě)的不對(duì)嗎？謝謝
問(wèn)題解答
回答1：請(qǐng)教關(guān)于jquery阻止冒泡的問(wèn)題？-PHP中文網(wǎng)問(wèn)答-請(qǐng)教關(guān)于jquery阻止冒泡的問(wèn)題？-PHP中文網(wǎng)問(wèn)答
圍觀一下哦，學(xué)習(xí)一下。
回答2：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="jquery.min.js"></script> <style>.over-lay{ width: 300px; height: 300px; position: absolute; left:50px; top:50px; background-color: rgba(235,235,235,0.5);}.over-lay.hide{ display: none;}.content{ background-color: green; width: calc(100% - 60px); height: calc(100% - 0px); border-radius: 10px; position: absolute; left: 30px; top: 0px;}.back-button,.forward-button{ width: 30px; height: 30px; position: absolute; top:calc(50% - 15px); left:0px; background-color: red; font-size: 12px;}.forward-button{ right:0px; left:auto;} </style> <script>$(function(){ $(".over-lay").on("click",".back-button,.forward-button",function(event){ console.log("不關(guān)閉overlay");event.stopPropagation();//阻止冒泡到.over-lay }); $(".over-lay").on("click",function(event){console.log("關(guān)閉overlay");$(this).addClass("hide"); });}); </script></head><body><div> <div class="back-button">后退</div> <div></div> <div class="forward-button">前進(jìn)</div></div></body></html>
相關(guān)文章：
1. docker 17.03 怎么配置 registry mirror ?2. 前端 - @media query 使用出現(xiàn)的問(wèn)題？3. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣？這個(gè)是怎么回事？？？？4. node.js - mongodb查找子對(duì)象的名稱(chēng)為某個(gè)值的對(duì)象的方法5. 運(yùn)行python程序時(shí)出現(xiàn)“應(yīng)用程序發(fā)生異常”的內(nèi)存錯(cuò)誤？6. html5 - datatables 加載不出來(lái)數(shù)據(jù)。7. 測(cè)試自動(dòng)化html元素選擇器元素ID或DataAttribute [關(guān)閉]8. javascript - QQ第三方登錄的問(wèn)題9. 利用IPMI遠(yuǎn)程安裝centos報(bào)錯(cuò)！10. spring-mvc - spring-session-redis HttpSessionListener失效
網(wǎng)公網(wǎng)安備