請教關于jquery阻止冒泡的問題?
問題描述
如圖,我有一個彈窗想點擊除輪播區域外的地方關閉彈窗,點擊切換按鈕實現切換圖片
代碼如下
$('.cut-model').bind('click',function(e){ $(this).hide();//點擊空白區域關閉彈窗})$('.round').bind('click',function(e){ e.stopPropagation();//點擊切換按鈕阻止冒泡})
然而。。。。并沒有成功,點擊切換按鈕時彈窗仍然關閉,請教各位大神是什么原因,我寫的不對嗎?謝謝
問題解答
回答1:請教關于jquery阻止冒泡的問題?-PHP中文網問答-請教關于jquery阻止冒泡的問題?-PHP中文網問答
圍觀一下哦,學習一下。
回答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("不關閉overlay");event.stopPropagation();//阻止冒泡到.over-lay }); $(".over-lay").on("click",function(event){console.log("關閉overlay");$(this).addClass("hide"); });}); </script></head><body><div> <div class="back-button">后退</div> <div></div> <div class="forward-button">前進</div></div></body></html>
相關文章:
1. docker gitlab 如何git clone?2. docker鏡像push報錯3. 關于docker下的nginx壓力測試4. angular.js使用$resource服務把數據存入mongodb的問題。5. android - 項目時間長了,字符串文件strings有的字符串可能是多余的,有沒有辦法快速檢測那些是沒用的?6. android - 七牛單次上傳單張圖片,11次6次上傳失敗7. mysql - 用PHPEXCEL將excel文件導入數據庫數據5000+條,本地數據庫正常,線上只導入15條,沒有報錯,哪里的問題?8. javascript - 怎么看網站用了什么技術框架?9. docker不顯示端口映射呢?10. 在windows下安裝docker Toolbox 啟動Docker Quickstart Terminal 失敗!
