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 onclick="alert(‘table‘)">
<tr onclick="alert(‘tr‘)"><td onclick="alert(‘td‘)"><p onclick="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被点了")后被阻止
时间: 2024-10-11 23:14:38