jQuery代码
<script type="text/javascript"> $(function () { $("#p1").click(function () { alert("p1被点了"); }); $("#td1").click(function (e) { alert("td1被点了"); e.stopPropagation() }); //阻止冒泡 $("#tr1").click(function () { alert("tr1被点了"); }); $("#t1").click(function () { alert("t1被点了"); }); }); </script>
HTML代码
<table οnclick="alert('table')"> <tr οnclick="alert('tr')"><td οnclick="alert('td')"><p οnclick="alert('p')">1111222</p></td></tr> </table> <table id="t1"> <tr id="tr1"><td id="td1"><p id="p1">hgdfjkgh</p></td></tr> </table>
当点击（1111222）时第一个table中的点击相应顺序为p,td,tr,table
当点击（hgdfjkgh）时由于在jQuery代码中设置了阻止冒泡时间，使相应在alert("td1被点了")后被阻止
转载于:https://www.cnblogs.com/DillonFly/p/4561998.html
