用不同變量名稱的JavaScript插入HTML表格行

我有一個允許用戶編輯其數據的頁面（在數據庫上）。我有一個插入行的JavaScript。這些行包含其值存儲在不同變量中的文本框。所以，我需要一種方法來插入具有相同結構但不同變量名稱的表格行。
用不同變量名稱的JavaScript插入HTML表格行

爲了在同一時間插入/編輯數據，我需要不同的字段不同的值。（插入/編輯的edited.php頁面上進行）

的JavaScript：

<script type="text/javascript"> 
    function addRow(tableID) { 

     var table = document.getElementById(tableID); 

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

     var colCount = table.rows[0].cells.length; 

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

      var newcell = row.insertCell(i); 

      newcell.innerHTML = table.rows[1].cells[i].innerHTML; 
      //alert(newcell.childNodes); 
      switch(newcell.childNodes[0].type) { 
       case "text": 
         newcell.childNodes[0].value = ""; 
         break; 
       case "checkbox": 
         newcell.childNodes[0].checked = false; 
         break; 
       case "select-one": 
         newcell.childNodes[0].selectedIndex = 0; 
         break; 
      } 
     } 
    } 

</script>

該腳本將在我的HTML表的錶行。該插入是通過複製第一個表格行來完成的。我需要一個NEW變量的NEW行。

有無論如何定義插入的行嗎？

來源

2014-05-21 armandomaria

插入新行是否成功？你想要插入單元格的值是什麼？ –

單元格包含文本框。這些文本框從數據庫中選擇了信息，因此用戶只需編輯他想要的任何內容。現在我有一個按鈕，允許使用相同的文本框但不同的變量插入更多的單元格。它會插入一個新的HTML行。 – armandomaria

你能用完整的代碼創建一個http://jsfiddle.net嗎？ –

您可以使用JavaScript的createElement功能，這裏是一個小例子，應該讓你對你的方式：

function addNewRow(tableID) { 

     var table = document.getElementById(tableID); 

     var row = document.createElement('tr'); 
     var data = document.createElement('td'); 
     var tbx = document.createElement('input'); 
     tbx.setAttribute('type', 'text'); 

     data.appendChild(tbx); 

     row.appendChild(data); 
     table.appendChild(row); 

    }

它應該是相當不言自明，創建一個元素，設置其屬性，並添加子元素吧，你的情況：文本框，複選框等

如果你需要有動態的ID和/或值，添加一個計數器變量，增量爲您去和/或添加參數，如

function addNewRow(tableID, input1, input2, input3){}

來源

2014-05-21 11:46:29 EaziLuizi

您可以將名稱分配給你動態創建這樣的每一行：

var row_counter=0 // have a global counter 
var row = table.insertRow(rowCount); 
row.setAttribute("id", "row"+row_counter); 
//NOW INCREMENT THE COUNTER BASED ON YOUR LOOP

您可以制定出你想要的方式循環。

來源

2014-05-21 11:47:35

用不同變量名稱的JavaScript插入HTML表格行

回答

相關問題