动态添加的html元素绑定事件的方法
避免先写了DOM操作,但是元素是动态加载的,所以点击不生效,比较好的方法有两个:
1、动态添加的时候加行内事件,比如onclick="funcName()"
在js中写好方法名对应的方法就可以了,如果绑定方法的元素太多,可以考虑使用方法二;
2、jquery的on事件绑定
eg:
on事件可以给动态添加的元素也绑定事件。
$("#optionGroup").on('click','.input-group .delete-option',function () {
console.log("aaa")
let num = $(this).parents(".input-group").index();
console.log(num)
})
注意:on事件先是获取到父元素,然后绑定到子元素上,父元素最好是已经存在的元素,而不是动态添加的。
动态添加的html元素绑定事件的方法的更多相关文章
- jQuery给动态添加生成的元素绑定事件的方法
<div id="testdiv"> <ul></ul> </div> 需要给<ul>里面动态添加的<li&g ...
- jquery给动态添加的dom元素绑定事件
$('input').click(function () { //处理代码 }); 这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定,对于页面中动态添加的元素,在页面加载完成后 ...
- Jquery为动态添加的未来元素绑定事件
语法: $(selector).on(event,childSelector,data,function) event:必需.规定要从被选元素移除的一个或多个事件或命名空间.由空格分隔多个事件值,也可 ...
- js进阶---12-11、jquery如何给动态创建出来的元素绑定事件
js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...
- 【原生js】js动态添加dom,如何绑定事件
首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...
- jQuery给动态添加的元素绑定事件的方法
我们在开发过程会遇到无法给动态元素添加绑定事件,解决方案如下: 例如 <div id="testdiv"> <ul></ul> </d ...
- 关于动态添加的html元素绑定的事件不生效的解决办法
1.可以通过行内添加事件的方法,比如onclick="fn()"; 在js中写好方法名对应的方法就可以了,如果绑定方法的元素太多 2.jquery的on事件绑定 //on事件可以给 ...
- JS动态添加的标签无法绑定事件解决方案~~~
今天用ajax实现动态插入数据时发现监听一直不起作用,一样的代码,非动态的就可以监听实现 这是困扰了我近一个小时的bug,后面才理解到可能是动态插入导致的! 看了看网上的解决方案,似乎都不太通俗,讲的 ...
- jquery:为动态加载的元素绑定事件
最近在做项目的时候发现的一个问题,通过ajax动态加载出来的一个button值绑定不了点击事件.我使用的是datatables这款表单插件,表单内容是通过ajax动态渲染出来的. 解决方案: 通过Go ...
随机推荐
- angularjs去掉加载时的{{}}
添加css <style> .ng-cloak {display: none;} </style> 在body头文件中加上class=ng-cloak &l ...
- [转]JSP中EL表达式三元运算符的使用
原文地址:http://www.guance.com/469.html Java中的三元运算符为:条件?条件为true值:条件为false的值EL也有一样的运算符,用EL的三元运算符有时可以代替c:c ...
- mac OS X中升级php5.5至php5.6 or php7
在做php项目中,提示“Warning. PHP 5.6 or newer is required. Please, upgrade your local PHP installation.” 通过p ...
- 依赖注入(Dependency Injection)
Spring的两个核心内容为控制反转(Ioc)和面向切面(AOP),依赖注入(DI)是控制反转(Ioc)的一种方式. 依赖注入这个词让人望而生畏,现在已经演变成一项复杂的编程技巧 或设计模式理念.但事 ...
- Java 原码 反码 补码
本篇文章讲解了计算机的原码, 反码和补码. 并且进行了深入探求了为何要使用反码和补码, 以及更进一步的论证了为何可以用反码, 补码的加法计算原码的减法. 论证部分如有不对的地方请各位牛人帮忙指正! 希 ...
- vba的一个File操作类
Option Explicit '-------------------------------------------------------- '[Class name]: clsTxtFile ...
- linux进程管理(四)
[教程主题]:进程管理 [1]进程介绍 程序和进程 程序是为了完成某种任务而设计的软件,比如OpenOffice是程序.什么是进程呢?进程就是运行中的程序. 一个运行着的程序,可能有多个进程. 比如自 ...
- log4写完日志不会自动释放
今天想做个日志记录功能.网上查了下.决定使用log4net 来做. 但是最发现在写日志的时候.会一直占用当前的日志文件.当你想查看的时候会提示另一个进程占用了该文件. 只有到他创建下一个日志文件.然后 ...
- MySql5.7配置文件my.cnf设置
# MySql5.7配置文件my.cnf设置[client]port = 3306socket = /tmp/mysql.sock [mysqld]########################## ...
- 关于 HTTP GET/POST 请求参数长度最大值的一个理解误区
1. Get方法长度限制 Http Get方法提交的数据大小长度并没有限制,HTTP协议规范没有对URL长度进行限制.这个限制是特定的浏览器及服务器对它的限制. 如:IE对URL长度的限制是20 ...