首先看一段html代码
<body>
<button id="addText">添加文本</button>
<div id="alert">1</div>
</body>
<script>
innerHtml = '<tr class="menus">' +
'<td>我是测试文本<input type="checkbox" name="checkbox" class="checkAttrs" ></td>' +
'</tr>';
$('#addText').click(function () {
$('#alert').html(innerHtml);
});
$('.checkAttrs').click(function () {
alert("click方法");
});
</script>
第一个click事件,即摁扭id为addText的事件是可以触发的,因为页面先有,再有绑定方法。
第二个click事件,即class为checkAttrs的事件不可触发,因为先有方法,页面是点击摁扭之后加的。
on事件委托:父元素接收委托事件
<body>
<button id="addText">添加文本</button>
<div id="alert">1</div>
</body>
<script>
innerHtml = '<tr class="menus">' +
'<td>我是测试文本<input type="checkbox" name="checkbox" class="checkAttrs" ></td>' +
'</tr>';
$('#addText').click(function () {
$('#alert').html(innerHtml);
});
$("body").on('click', '.checkAttrs', function () {
alert("on方法");
});
</script>
最后
以上就是健康牛排最近收集整理的关于on事件委托的全部内容,更多相关on事件委托内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复