在javascript中使用tr id更新tr innerHTML

<script type="text/javascript"> 
    Array.prototype.AddRecord = function() { 

     document.getElementById('mytable').style.display = "block"; 
     table 
     var table = document.getElementById("mytable"); 
     var rows = table.rows.length; 

     var row = table.insertRow(rows++); 
     var cell1 = row.insertCell(0); 
     var cell2 = row.insertCell(1); 
     var cell3 = row.insertCell(2); 
     var cell4 = row.insertCell(3); 
     var cell5 = row.insertCell(4); 

     //alert(row.id); 
     var name = this[0]; 
     var age = this[1]; 

     var param = "editrow(\'" + name + "\'," + age + "," + rows + ")"; 
     var param1 = "deleterow(" + rows + ")"; 
     var param2 = "Update(\'" + name + "\'," + age + "," + rows + ")"; 

     cell1.innerHTML = name; 
     cell2.innerHTML = age; 
     cell3.innerHTML = "<input type='button' value='Edit' id='edit' onclick=" + param + " >"; 
     cell4.innerHTML = "<input type='button' value='Delete' id='delete' onclick=" + param1 + ">"; 
     cell5.innerHTML = "<input type='button' value='Update' id='update' onclick=" + param2 + ">"; 

    } 

    function Update(name, age, row) { 
     alert(name); 
     alert(age); 
     alert(row); 
     document.getElementById('create').style.display = "none"; 
     document.getElementById('update').style.display = "block"; 

    } 
</script>

我想更新行，具體取決於tr id的行id，並更新tr cell數據請幫助我，我是一個新手... Thanx in提前...在javascript中使用tr id更新tr innerHTML

來源

2013-08-30 user2699972

上午通過行ID或行號更新功能，但我不知道如何更新孩子節點或細胞數據... – user2699972

你在哪裏遇到麻煩？順便說一句，改變表格和單元格的'display'類型不是一個好主意。讓它們保持原樣（'table'，'table-cell'等）並使用'visibility'屬性代替。 –

在更新功能我想通過使用tr行號訪問td值，因爲有很多記錄添加和需要更新特定記錄 – user2699972

這就是jQuery的問題，你會沉迷於它。反正這裏是原始的JavaScript解決方案：

這裏的關鍵是分配ID到你的行，以便以後你可以獲取它。

http://jsfiddle.net/PnMPk/1/ < <工作示例。

updateMethod = function (nm, age, rowID){ 
    //alert('Changing Name of :' + rowID); 
    var o = getO(rowID); 
    o.children[0].innerText = 'Changed'; 
    o.style.color = 'red'; 
}; 

//getO => 
var getO = function(_id){ 
    return document.getElementById(_id); 
}; 

Array.prototype.AddRecord = function() { 
getO('mytable').style.display = "block"; 
     table 
     var table = getO("mytable"), 
      rows = table.rows.length, 
      row = table.insertRow(rows++), 
      cell1 = row.insertCell(0), 
      cell2 = row.insertCell(1), 
      cell3 = row.insertCell(2), 
      cell4 = row.insertCell(3), 
      cell5 = row.insertCell(4), 
      rowID = 'row_'+ table.rows.length; 

     row.setAttribute('id', rowID); //Assign some ID 

     var name = this[0], 
      age = this[1], 
      param = "editrow(\'" + rowID + "\'," + age + "," + rows + ")", 
      param1 = "deleterow(" + rowID + ")", 
      param2 = "updateMethod(\'" + name + "\'," + age + ",'" + rowID + "')"; 

     cell1.innerHTML = name; 
     cell2.innerHTML = age; 
     cell3.innerHTML = "<input type='button' value='Edit' id='edit' onclick=" + param + " >"; 
     cell4.innerHTML = "<input type='button' value='Delete' id='delete' onclick=" + param1 + ">"; 
     cell5.innerHTML = "<input type='button' value='Update' id='update' onClick=" + param2 + ">"; 


    }; 

['rakesh',26].AddRecord(); 
['juyal',28].AddRecord(); 
['Click',26].AddRecord(); 
['update',28].AddRecord(); 
['CHANGE_NAME',28].AddRecord();

讓我知道你是否需要對它進行一些修改。

來源

2013-08-30 09:42:02

在javascript中使用tr id更新tr innerHTML

回答

相關問題