如何在动态div上插入onclick（）

以下是使用javascript生成动态div的功能。我想在生成的动态div上使用javascript onclick（）。但在onclick执行时，我没有获得变量的实际值。也没有相邻的onclick（）不工作。在此先感谢。如何在动态div上插入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+"&nbsp;,&nbsp;"+fld+"&nbsp;,&nbsp;"+fidpartnum+"&nbsp;Paticipants, &nbsp;"+fidrepeat+"&nbsp;Repeat"; 
      //ele.innerHTML=fldOne+"&nbsp;,&nbsp;"+fld+"&nbsp;,&nbsp;"+fidpartnum+"&nbsp;Paticipants, &nbsp;"+fidrepeat+"&nbsp;Repeat"; 
      document.getElementById("showselecteditems").appendChild(ele); 
    } 
     i++; 
     } 

    }

来源

2013-10-23 Arun CH

尝试使用'addEventListener'就像'var el = document.getElementByTagName（“a”）; el.addEventListener（“click”，closedthis（par），false）;' – Praveen

对不起，我不能使用事件监听器。我希望单击事件附加到'a'标签中，并在其中包含一个动态ID。 –

你可以使用div标签上的点击事件吗？ – SANDEEP

我建a fiddle here样品。

这里的关键是你应该不是在循环中使用这样的东西。

<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。

来源

2013-10-23 06:41:57 lastr2d2

您可以试试这个| Demo

function myfunc() 
{ 
    alert('clicked'); 
} 

var el = document.createElement('a'); 
el.setAttribute("href","javascript:void(0)"); // to cancel the default effect of anchor tag 
el.onclick = myfunc; 
if(el.innerText) 
{ 
    el.innerText = "click me"; 
} 
else el.textContent ="click me"; 
document.body.appendChild(el);

来源

2013-10-23 05:59:25 Shadow

如何在动态div上插入onclick（）

回答

相关问题