以下是我使用JavaScript生成动态div的函数。我想在生成的动态div上使用javascript onclick（）。但是在onclick执行时，我没有得到变量的实际值。也没有相邻的onclick（）不起作用。提前致谢。
function selecteditems()
{
var i=1;
//var val="";
var fld = "";
var newdiv = document.createElement("div");
document.getElementById("showselecteditems").innerHTML="";
while(i<=53)
{
fldOne = document.getElementById('datepicker_value').value;
fld = document.getElementById('timedrpact'+i).value;
fidpartnum = document.getElementById('selectdrpact'+i).value;
fidrepeat = document.getElementById('repeat'+i).value;
if(fld!="")
{
var par='ddwnx'+i;
var ele = document.createElement("div");
ele.setAttribute("id","showselecteditems"+i);
ele.setAttribute("class","inner");
//Trouble here.Onclick() not alerts actual value.Instead alert as [objectHTMLDivElement].
//Also consecutive onclick not working.
ele.innerHTML="<a onclick='return closedthis("+par+")';><img src='images/close.png' width='30' height='30'></a>"+fldOne+" , "+fld+" , "+fidpartnum+" Paticipants, "+fidrepeat+" Repeat";
//ele.innerHTML=fldOne+" , "+fld+" , "+fidpartnum+" Paticipants, "+fidrepeat+" Repeat";
document.getElementById("showselecteditems").appendChild(ele);
}
i++;
}
}
这里的关键是你应该不是在一个循环中使用这样的事情。
<a onclick='return closedthis("+par+") ...
即使有效，该参数par也始终是您设置的最后一个值，即54。您应该设置一个自定义属性，例如data-index为动态元素设置并this.getAttribute()在事件处理程序中使用。
$ = document.getElementById.bind(document);
$("createButtons").addEventListener("click", function () {
$("container").innerHTML = "";
for (var i = 0; i < 50; i++) {
var element = document.createElement("div");
element.setAttribute("class", "dynamicButton");
element.setAttribute("data-index", i);
element.innerHTML = i;
element.onclick = function () {
// do not use this, since when you click the button, i will always be 50 (the last value you set)
// $("clickedIndex").innerText = i;
// use this instead
var index = this.getAttribute('data-index');
$("clickedIndex").innerText = index;
};
/*
element.addEventListener("click ", function () {
var index = this.getAttribute('data-index');
$("clickedIndex").innerText = index;
});
*/
$("container").appendChild(element);
}
});
当然，您也可以使用element.addEventListener。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句