js 为动态添加的元素绑定事件_IT百科

想必大家都有遇到过，DOM动态添加的元素，你给它绑定的事件是不起作用的。目前有两种办法，为动态添加的元素绑定事件

⚠️ 动态添加的子元素一定要放在on()方法里面，并且on()方法里面的 childSelector 必须要是 selector 的子元素，否则动态添加的元素绑定的事件依旧无效

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

li{

margin-bottom: 5px

}

</style>

</head>

<body>

<p>每次点击都创建一个li标签，动态给创建的li标签添加点击事件。</p>

$(function(){

//创建li事件

$("button").click(function(event) {

var li = $("<li>").text("点击我!")

$("ul").append(li)

})

//为每个新创建的li绑定点击事件

$("body").on('click', 'li', function(event) {

var txt = "这是第"+($(this).index()+1)+"个li标签"

alert(txt)

})

</script>

</body>

</html>

欢迎分享，转载请注明来源：内存溢出

js 为动态添加的元素绑定事件