如何在動態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（）

回答

相關問題