無力的attachEvent給行使用DOM

function addRow(names,count) { 

    deleteRow(); 
    var table = dataTable; 

    for(var i=0;i<count;i++) 
    { 

     var rowCount = table.rows.length; 
     var row = table.insertRow(rowCount); 

     var cell2 = row.insertCell(0); 
     cell2.innerHTML = rowCount; 

     var cell3 = row.insertCell(1); 
     var element2 = document.createElement('tr'); 
     var element3 = document.createElement('td'); 
     //element2.type = "text"; 
     element2.appendChild(element3) 
     cell3.appendChild(element2); 
     cell3.innerHTML = names[i]; 
     element3.attachEvent("test()", onclick); 

    } 
}

，這是我的代碼示例，我無法把事件要麼在element2或元素3，任何人可以幫助我，什麼這個無力的attachEvent給行使用DOM

問題這是我試用過的一個樣本，它包含完整的代碼。

<HTML> 
<HEAD> 
    <TITLE> Add/Remove dynamic rows in HTML table </TITLE> 
    <SCRIPT language="javascript"> 
     function addRow(tableID) { 

      var table = document.getElementById(tableID); 

      var rowCount = table.rows.length; 
      var row = table.insertRow(rowCount); 

      var cell1 = row.insertCell(0); 
      var element1 = document.createElement("input"); 
      element1.type = "checkbox"; 
      cell1.appendChild(element1); 

      var cell2 = row.insertCell(1); 
      cell2.innerHTML = rowCount + 1; 

      var cell3 = row.insertCell(2); 
      var element2 = document.createElement("input"); 
      element2.type = "text"; 
      cell3.appendChild(element2); 
      element2.attachEvent("onclick",function(){ alert("event triggered"); }); 


     } 

     function deleteRow(tableID) { 
      try { 
      var table = document.getElementById(tableID); 
      var rowCount = table.rows.length; 

      for(var i=0; i<rowCount; i++) { 
       var row = table.rows[i]; 
       var chkbox = row.cells[0].childNodes[0]; 
       if(null != chkbox && true == chkbox.checked) { 
        var index = table.rowIndex; 
        alert("index"+index); 
        //table.deleteRow(i); 
        //rowCount--; 
        i--; 
       } 

      } 
      }catch(e) { 
       alert(e); 
      } 
     } 

    </SCRIPT> 
</HEAD> 
<BODY> 

    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /> 

    <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /> 

    <TABLE id="dataTable" width="350px" border="1"> 
     <TR> 
      <TD><INPUT type="checkbox" name="chk"/></TD> 
      <TD> 1 </TD> 
      <TD> <INPUT type="text" /> </TD> 
     </TR> 
    </TABLE> 

</BODY> 
</HTML>

來源

2012-02-02 nithin

我們將需要更多的信息。你有更多的腳本或HTML向我們展示？就目前而言，'deleteRow（）'和'dataTable'未定義。 – Tim 2012-02-02 05:36:54

deleteRow不包含任何html，並且var table = dataTable;提取桌面 – nithin 2012-02-02 05:39:53

在哪個瀏覽器中測試過它？ – AmGates 2012-02-02 05:42:36

邏輯和語法錯誤，繼承人故障。

cell3.appendChild(element2); // appends your element 
cell3.innerHTML = names[i]; // deletes element2 and replaces it with names[i]

element2不存在，因爲你設置裏面cell3一切是names[i]你附加element2後。

您還需要更新事件綁定（IE）

element3.attachEvent("onclick", function(){ /* code */ });

來源

2012-02-02 05:47:42

好吧，但如果我不使用這種方式，我不能打印行內的價值 – nithin 2012-02-02 06:40:35

我猜你想在TD單元格中的值，因爲它的無效標記將文本放在內部和外部試試這個：'element3.innerHTML = names [i]' – 2012-02-02 06:42:57

ya我想要一個td內的值，但是這個值不會顯示，如果這樣使用的話 – nithin 2012-02-02 07:26:38

試試這個..

element3.onclick = function() { 
       test(); 
      }

來源

2012-02-02 05:49:33 Neelam

this也沒有工作 – nithin 2012-02-02 06:07:30

當你嘗試這種情況會發生什麼.. ?? – Neelam 2012-02-02 08:27:07

element3.addEventListener（'onclick'，function（e）{ // your code }，false）; – Neelam 2012-02-02 08:28:43

無力的attachEvent給行使用DOM

回答

相關問題