jquery获取动态添加的标签对象
来源:互联网 发布:网络于柚子是什么意思 编辑:程序博客网 时间:2024/04/30 10:28
jquery无法直接给网页里面动态添加点击事件,并且获取到对象
一般来说,js获取动态添加的组件都是自定义给标签添加上onclick属性来达到调用,这是普通的方法,如下:
onclick方式获取<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="test"></div></body><script type="text/javascript" src="js/jquery-3.2.1.min.js"></script><script> var html="";//声明变量用于存放html for (i=0;i<=10;i++){ html=html+"<button onclick='btnclick(this)'>按钮"+i+"</button></br>"; } $('#test').html(html); function btnclick(e) { console.log(e.textContent);//获取按钮文本 }</script></html>
如今jquery已经到了3版本了,官方已经放弃live方式了,推荐使用on方法。语法为
$(‘选择器’).on(‘click’,’选择类型’,function (e){代码段}
jquery不能动态获取到网页里面的标签,需要先获取到网页固定的标签,让后再获取里面其他的标签,所以,如上面代码中的id为test的div是固定不变的。
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="test"></div></body><script type="text/javascript" src="js/jquery-3.2.1.min.js"></script><script> var html="";//声明变量用于存放html for (i=0;i<=10;i++){ html=html+"<button>按钮"+i+"</button></br>"; } $('#test').html(html); $('#test').on('click','button',function (e){ console.log($(this)); });</script></html>
这样写就非常简单了,其中选择类型里面的button还可以进一步限制,如:button[class=test],就是选择动态创建的类为text的按钮。
要实现单双数只需要在test后面加”:even”,button[class=test]:even,或者odd偶数
下图演示jquery动态获取奇数对象
阅读全文
0 0
- jquery获取动态添加的标签对象
- jQuery如何获取动态添加的元素
- jquery动态添加标签页
- Jquery 动态获取上一个节点的对象
- jQuery基础学习(3)(获取标签属性,动态添加标签)
- jquery 动态的添加数据,获取动态的数据
- 用jquery动态添加html任何标签的自定义属性
- Jquery选择选择动态添加HTML标签的事件
- Jquery动态生成的标签添加绑定事件
- jquery动态添加带有样式的HTML标签元素
- Unity3D获取GameObject的所有子对象,添加特定标签
- jquery获取动态添加的combobox已选中的text
- JS&JQuery动态添加select option标签
- JQUERY 获取当前焦点对象属性, jquery attr()方法 添加,修改,获取对象的属性值。
- jquery 获取动态添加后子节点的元素个数
- 用Jquery的attr方法动态添加JSON对象参数
- jquery attr()方法 添加,修改,获取对象的属性值。
- jquery attr()方法 添加,修改,获取对象的属性值
- win7,win10右键添加“获取管理员的所有权限”的菜单
- 利用Python画小树和森林(宽度优先绘制+深度优先绘制)
- for 的用法
- 在Ubuntu系统中配置DHCP服务
- 安卓动画 补间动画
- jquery获取动态添加的标签对象
- C# mvc SignalR 即时推送
- 看了牛客网要发博客才好找工作,发篇冷静一下
- ssh秘钥登录服务器遇到的问题
- 类与对象-类的定义
- 本地连接云服务器上的kafka集群,进行java开发,报错
- oracle的层级查询
- 基于Hexo的逐梦小站上线,欢迎访问
- win64+python2.7(64位)+anaconda下安装xgboost