js 给动态li添加动态点击事件
生活随笔
收集整理的這篇文章主要介紹了
js 给动态li添加动态点击事件
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
一、給動態(tài)li添加動態(tài)點擊事件
試了網(wǎng)上的on,live,bind綁定，都不起作用。最后看到https://bbs.csdn.net/topics/390414057?
上的代碼。試了一遍，demo ok。
附上demo：
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script><script type="text/javascript">$(document).ready(function() {var ul = $("ul");$(document).on("click", "li.new", function() {alert($(this).text());});$("#addLi").click(function() {ul.append("<li class=\"new\">"+(ul.children("li").size()+1+"li")+"</li>");});});</script> </head> <body><ul id="ul"><li class="new">1</li><li class="new">2li</li><li class="new">3li</li></ul><input type="button" value="click" id="addLi" /> </body> </html>我的實踐代碼：
HTML代碼：
<div class="infoShow" style="margin-top:5px;"><ul id="info"></ul></div>js代碼：?
$("#info").append("<li class=\"new\" >"+info_scroll+"</li>");$(document).on("click","li.new",function(){console.log("異常信息查詢");$.ajax({url:'/getEventDataById/',type:'post',data:{"appcontent":appcontent}}).done(function(data){ShowDiv('MyDiv','fade');document.getElementById('info_projectname').innerText=data.project_info[0];document.getElementById('info_taskname').innerText=data.project_info[1];document.getElementById('info_cameraid').innerText=data.project_info[2];document.getElementById('info_tempValue').innerText=data.project_info[3];document.getElementById('info_tempRect').innerText=data.project_info[4];document.getElementById('info_image_temp01').src=data.imageTempFilename_0;document.getElementById('info_image_temp02').src=data.imageTempFilename_1;document.getElementById('info_image_exception').src=data.exception_imagepath;})})二、為動態(tài)li綁定不同的事件（獲取當前l(fā)i的index值，然后綁定事件）?
我的實踐：
var ul=$("#info"); ul.append("<li id=\""+appcontent+"\"+ class=\"neww\" >"+info_scroll+"</li>");var lis=$('#info li');for(var i=0;i<lis.length;i++){lis[i].onclick=function(){idd=this.id; //獲取此li下的idli_class=this.className; //獲取此li下的classnameconsole.log(idd);$.ajax({url:'/getEventDataById1/',type:'post',data:{"appcontent":idd}}).done(function(data){console.log("info_image_exception:"+data.exception_imagepath);ShowDiv('MyDiv','fade');})}?
總結
以上是生活随笔為你收集整理的js 给动态li添加动态点击事件的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： C语言-字符串处理函数strcat
- 下一篇： linux mplayer_移植mpla