为动态生成html元素增加事件处理 |
| [ 作者:佚名 转贴自:网络转载 阅读次数:28 更新时间:2007-11-30 18:34:00 录入:刘光勇 ] |
|
|
|
Adding onClick property to dynamicly genertated html element
function klik(){ alert("ppp"); }
function addNewImg(newImageId){ newImg = document.createelement('img'); newImg.id = "image"+newImageId; newImg = document.getElementById("divimage1").appendChild(newImg); newImg.onclick=klik }
it works. The new image is created and after clicking on it "ppp" is alerted.
but when I use this:
function klik(ff){ alert(ff); }
function addNewImg(newImageId){ newImg = document.createelement('img'); newImg.id = "image"+newImageId; newImg = document.getElementById("divimage1").appendChild(newImg); newImg.onclick=klik("ppp"); }
"ppp" is alerted in the moment of executing the statement newImg.onclick=klik("ppp"); and when clicking on the generated image nothing happens, even javascript Console of Firefox stays blind.
function addNewImg(newImageId){ newImg = document.createelement('img'); newImg.id = "image"+newImageId; newImg = document.getElementById("divimage1").appendChild(newImg); var onC='ppEdit("image'+newImageId+'","image")'; document.getElementById("image"+newImageId).onclick=new Function(onC); }
it works
maybe an object detection be great to add too why? So browsers that understand document.getElementById, document.createelement execute the code.
function addNewImg(newImageId){ //object detection check if (!document.getElementById &&!document.createelement){return;} newImg = document.createelement('img'); newImg.id = "image"+newImageId; newImg = document.getElementById("divimage1").appendChild(newImg); var onC='ppEdit("image'+newImageId+'","image")'; document.getElementById("image"+newImageId).onclick=new Function(onC); }
alternative solution: if (!document.getElementById) {return;} document.getElementById("image"+newImageId).onclick=function(){ ppEdit(this.id, "image"); }
|
|
|
|