您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

JS为动态创建的元素添加事件

2024/3/21 7:35:53发布34次查看
本文主要和大家介绍了js实现为动态创建的元素添加事件操作,涉及javascript页面元素动态添加及事件响应相关操作技巧,需要的朋友可以参考下,希望能帮助到大家。
html中直接生成的元素,添加事件,我们都知道,但是如何为一个动态生成的元素添加事件呢,jquery中的live方法可以做到这一点
具体实现可以在demo中看到
<!doctype html> <html> <head> <meta charset="utf-8"> <title>www.jb51.net - js实现为动态创建的元素添加事件</title> <script src="js/lib/jquery-1.7.2.min.js"></script> </head> <body> <button id="btn">添加事件</button> <p id="panel"></p> <script> // js原生实现 // var btn=document.getelementbyid("btn"); // btn.onclick=function(){ // var arr= []; // for(var i=0;i<10;i++){ // arr.push("<p id='nep'>"+i+"</p>"); // } // // document.getelementbyid("panel").innerhtml=arr.join('<br/>'); // } // //jquery部分实现 $("#btn").click(function(){ var arr= []; for(var i=0;i<10;i++){ arr.push("<p id='nep'>"+i+"</p>"); } $("#panel").html(function(){ return arr.join("<br/>"); }); }); //为动态创建的html标签元素添加事件 $("#nep").live("click",function(){ var that=$(this);//获取当前点击的this对象 console.log(that.text()); }); </script> </body> </html>
运行结果:
相关推荐:
react怎样给button添加事件
js实现动态添加事件的相关技巧
jquery为动态生成的select元素添加事件的方法
以上就是js为动态创建的元素添加事件的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product