js中 ajax动态新增节点无法触发点击事件
在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件。
其实最简单的方法就是直接在标签中写onclick="",但是这样写有些场景的是实现不了的,最好的方式还是通过给类名绑定一个click事件。
方法一:使用live:
live()函数会给被选的元素绑定上一个或者多个事件处理程序,并且规定当这些事件发生时运行的函数。通过live()函数适用于匹配选择器的当前及未来的元素。比如,通过脚本动态创建的元素。
代码示例:
$('.demo1').live('click', function(){
alert('OK');
});
方法二:使用on:
可以通过on方法绑定事件,可以绑定到它的父级或者body中
代码示例:
$("#demo").on('click','.demol',function(){
alert('OK')
});
js中 ajax动态新增节点无法触发点击事件的更多相关文章
- 解决jQuery ajax动态新增节点无法触发点击事件的问题
在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...
- 关于AJAX异步加载节点无法触发点击事件问题的解决方式
做练习的过程中遇到一个问题,使用AJAX异步新增一个节点,无法触发点击事件,经过查阅之后知道一个方式,使用JS的委托事件,在此做一个记录. $(document).on('click', '.recr ...
- js中怎么为同级元素添加点击事件
事件件是javascript脚本语言的重要组成部分,因为有事件才使用户页面的体验更加的美好.元素添加事件是js语言中最基础的.我们可以为元素本身添加事件,也可以通过事件绑定和事件监听为元素的父元素和子 ...
- angular JS中使用jquery datatable添加checkbox点击事件
'use strict'; app.controller('DataTableCtrl', function ($scope, $compile) { $scope.selected = []; $s ...
- js中ajax如何解决跨域请求
js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...
- prototype.js 和 jQuery.js中 ajax 的使用
这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...
- js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快、简单 post:安全,量大,不缓存)(服务器同步和异步区别:同步:等待服务器响应当中浏览器不能做别的事情)(ajax和jquery一起用的)
js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快.简单 post:安全,量大,不缓存)( ...
- vue中Enter触发登录事件和javascript中Enter触发点击事件
created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...
- JS实现按下按键触发点击事件
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- PHP中||与or的区别
一直认为PHP中“or”和“||”是可以划等号的,其实不然,它们存在一个优先级的差别.下面通过一个例子说明它们的差异: <?php $a = false || true; //'||'的优先级大 ...
- Java集合类源码解析:AbstractList
今天学习Java集合类中的一个抽象类,AbstractList. 初识AbstractList AbstractList 是一个抽象类,实现了List<E>接口,是隶属于Java集合框架中 ...
- Android APK 签名文件MANIFEST.MF、CERT.SF、CERT.RSA分析
首先我们找一个已经签名的apk文件,修改后缀名为zip,然后解压.可以看到里面有一个META-INF文件夹,里面就是签名验证的文件.有三个文件MANIFEST.MF.CERT.SF.CERT.RSA分 ...
- Servlet版本冲突引起的Error
本地打包部署应用都可以正常启动和响应请求,但是通过CI打包部署到服务器有请求进来时就会报错: java.lang.NoSuchMethodError: javax.servlet.http.HttpS ...
- 【Spring】Autowired原理及与Resource注解区别
Autowired注解 Autowired顾名思义,表示自动注入,如下是Autowired注解的源代码: @Target({ElementType.CONSTRUCTOR, ElementType.M ...
- 浅谈Java虚拟机内存中的对象创建,内存布局,访问定位
参考于 深入理解Java虚拟机 这里介绍HotSpot虚拟机(自带的虚拟机) 1.对象的创建 对于程序员来说,创建对象的方法: User user1 = new User(); User user2 ...
- js 高级程序设计(笔记)
第二章 1.为了避免浏览器在呈现页面时出现明显的延迟,现代Web 应用程序一般都把全部JavaScript 引用放在<body>元素中页面内容的后面. 第三章 1.ECMAScript 中 ...
- vuex最详细完整的使用用法
来自:https://blog.csdn.net/qq_35430000/article/details/79412664#commentBox github仓库地址:https://github. ...
- 后端开发者的Vue学习之路(四)
目录 上节内容回顾: npm 介绍 安装 常用命令: 补充: 基于npm的Hello World 项目结构分析 用法迁移 小提醒 ES6语法 知识补充 单文件组件 使用注意: 路由 开启路由 定义路由 ...
- 控制台程序读取Excel设置角色权限
摘要: 本人微信公众号:微软动态CRM专家罗勇 ,回复283或者20181118可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me!我的网站是 www.luoyong.me ...