jquery之给动态添加的元素绑定事件

通常我们使用jquery给元素class='addContent'绑定点击事件时代码如下：

$(". addContent ").click(function(){
  alert("点击成功");
})

但是当我们动态添加另外一个class='addContent'的新元素时，新元素不能绑定上上述点击事件，我试着用定时器setInterval来刷新，代码如下：

setInterval(function(){
  $(". addContent ").click(function(){
    alert("点击成功");
  })
},30)

这样做解决了该功能，但是带来了另外一个麻烦——定时器不断执行会影响网页性能，如果页面功能复杂会出现位置bug，所以不建议这样使用。

下面给出几种解决方案

一. 动态添加元素时直接绑定事件

代码及结果如图1所示，我们在动态添加元素的的时候直接绑定事件，这样做需要绑定的方法是全局方法，不能是在jquery里面写的局部方法，不然会调用不到。

直接绑定.

代码及结果如图2所示，值得注意的是，这里的document可以换成需添加元素的已存在的父元素如#div1。

委托绑定

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。