解决jQuery ajax动态新增节点无法触发点击事件的问题

前端之家收集整理的这篇文章主要介绍了解决jQuery ajax动态新增节点无法触发点击事件的问题前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件。为什么点击事件失效,我们该怎么去解决呢?

其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点low的,最好的方式还是通过给类名绑定一个click事件。

解决jQuery ajax动态新增节点无法触发事件问题的两种解决方法,为了达到更好的演示效果,假设在某个页面的body下有以下结构的代码

  • 方法一:使用live:

    live()函数会给被选的元素绑定上一个或者多个事件处理程序,并且规定当这些事件发生时运行的函数。通过live()函数适用于匹配选择器的当前及未来的元素。比如,通过脚本动态创建的元素。

    实现如下:

    方法二:使用on:

    可以通过on方法绑定事件,可以绑定到它的父级或者body中,实现如下:

    通过上面的两种方法,都可以解决jQuery ajax动态新增节点无法触发点击事件的问题。知道方法了,赶紧的试试吧。

    以上所述是小编给大家介绍的解决jQuery ajax动态新增节点无法触发点击事件的问题。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

    原文链接:https://www.f2er.com/ajax/39055.html

    猜你在找的Ajax相关文章