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

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

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

解决

$("#demo").click(function(){

$("#demo").append('

aaa4'); //动态像ul的末尾追加一个新元素

});

方法一：使用live：

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

实现如下：

$('.demo1').live('click', function(){

alert('OK');

});

方法二：使用on：

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

$("#demo").on('click','.demol',function(){

alert('OK')

});

通过上面的两种方法，都可以解决

以上所述是小编给大家介绍的解决jQuery ajax动态新增节点无法触发点击事件的问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对前端开发者网站的支持！

ajax点击事件无法触发,解决jQuery Ajax动态新增节点无法触发点击事件的问题_婳祎_前端开发者...相关推荐

vue开发手机页面闪烁_Vue页面加载闪烁问题的解决方法_婳祎_前端开发者
v-if 和 v-show 的区别 v-if只会在满足条件时才会编译,而v-show不管是否满足条件始终会编译,v-show的显示与隐藏只是简单的切换也就是说,在使用v-if时,若值为false,那 ...
vue-resource ajax跨域,基于Vue-resource jsonp跨域问题的解决方法_婳祎_前端开发者
最近在学习关于什么是jsonp,以及为什么要用jsonp我就不多说了,不明白的同学自行百度一下. 我们先来说一下这里我以json数据为例,首先我们通过 $.get可以直接得到一个我们想要的对象,但 ...
动态添加新元素事件无法触发解决方法
问题:想从后端把数据传给前端,然后ajax动态创建新元素,此时新创建元素的事件无法触发解决办法:事件委托(jquery的on方法) 1.刚开始事件的常规写法写法 $(".del" ...
ajax拿table里的th值,Jquery Ajax 异步设置Table中某列的值
可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...
解决按钮点击后长按回车无限触发点击事件问题
思路: 包一层 UI 库的 button,在里面监听 onkeydown 和 onkeyup,用 flag 阻止长按回车一直触发. 然后在项目全局重新注册 el-button 覆盖掉UI内的按钮组件. ...
Jetty Cross Origin Filter解决jQuery Ajax跨域访问的方法
当使用jQuery Ajax post请求时可能会遇到类似这样的错误提示 XMLHttpRequest cannot load http://xxxxxx. Origin http://xxxxxx ...
ajax三种错误ie,ie下jquery ajax 80020101错误的解决方法
注意注释删除这些注释就可以了 Windows下一个MySQL有些错误的解决方法 1.无论是什么提示.我们有一个直接看错误日志.由于它描述了最具体描述错误日志. 于MySQL安装文件夹中找到 my.i ...
Storage事件无法触发解决
Web Storage 项目实践这段代码是从一个项目在摘出来的,主要实现了将一个图片利用canvas的toDataURL这个API转成BASE64编码的字符串(图片要先用drawImage画到can ...
如何解决微信小程序用户高频率触发点击事件？
<view bindtap='debounce' bindtouchstart="touchStart" bindtouchend="touchEnd"& ...

ajax点击事件无法触发,解决jQuery Ajax动态新增节点无法触发点击事件的问题_婳祎_前端开发者...

ajax点击事件无法触发,解决jQuery Ajax动态新增节点无法触发点击事件的问题_婳祎_前端开发者...相关推荐

最新文章

热门文章