父元素事件中禁止子元素的事件
生活随笔
收集整理的這篇文章主要介紹了
父元素事件中禁止子元素的事件
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
今天有同事過來找我,,,input checkbox 區域太小了,想在外層TD上加上點擊事件,但發現TD加了后,,,input也在里面,會被執行兩次,記錄一下,我寫的DOME
<!DOCTYPE html> <html> <head><meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0"><title>福利社</title><script type="text/javascript" src="/static/js/jquery.min.js"></script> </head> <body> <table><tr><td style="border: 1px solid #ff0000; width: 200px; height: 200px;"><input type="checkbox"> </td><td></td></tr></table> <script>$(function () {$(document).on("click", "td:first", function(event){var input =$(this).find("input");input.click();event.stopImmediatePropagation();});$(document).on("click", "td:first input", function(event){event.stopPropagation();// 阻止事件冒泡});});</script> </body> </html>?
總結
以上是生活随笔為你收集整理的父元素事件中禁止子元素的事件的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 大神求这个字体是那种谢谢
- 下一篇: onemix&nbsp;逍遥游3