JS中的动态表

时间:2013-03-30 19:16:25

标签: javascript dynamic onclick

这是我的代码段......

    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {   
        s=xmlhttp.responseText;
        info=s.split("!");
        elem=document.getElementById("add_players1");
        for (var i = 0 ;i < (info.length-1);i++ ) 
        {
        var row=elem.insertRow(-1); //here is where I need to call a function when I click on the element
        var x=row.insertCell(-1);
        var y=row.insertCell(-1);
        var z=row.insertCell(-1);
        temp=info[i].split(",");
        name=temp[0];
        val=temp[1];
        pos=temp[2];
        x.innerHTML=name;
        y.innerHTML=val;
        z.innerHTML=pos;

    }

基本上我所做的是从我的PHP文件中收到一些数据并动态创建一个表但我想要的是当我点击表中的一个元素时要运行一个函数。我被困在这里,因为我动态创建了一个表,因此不知道如何进行函数调用...请提供建议

1 个答案:

答案 0 :(得分:0)

您可以使用onclick属性将事件附加到javascript中的元素 在元素上,

var myfunction = function()
{
    alert("row clicked, id "+ this.id+", text"+this.innerHTML);
}

function addRow(){
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {   
        s=xmlhttp.responseText;
        info=s.split("!");
        elem=document.getElementById("add_players1");
        for (var i = 0 ;i < (info.length-1);i++ ) 
        {
        var row=elem.insertRow(-1); 
        row.onclick = myfunction;
        temp=info[i].split(",");
        for (j = 0; j < 3; i++) {
               appendDiv(row.insertCell(j), temp[j] , 'divStyle');
        }
    }
}

function appendDiv(cell, text, style) {
    var div = document.createElement('div'), 
        txt = document.createTextNode(text); 
    div.appendChild(txt);                    
    div.setAttribute('className', style);    
    cell.appendChild(div);                   
}