在動態添加的行中添加計數器到ID名稱

Question

這是添加行的函數的一部分。它的作用就像一個魅力，除了我還希望它爲每個新創建的元素集的ID名稱添加一個整數（+1）。

例如，下面的代碼會生成一行，一個單元格和一個按鈕。如果創建了三行，那麼我希望每行的按鈕ID分別爲foo1，foo2，foo3。

我該如何去做到這一點？

function addrow() { 
var i = 1; 
var table = document.getElementById("mytable"); 
var row = table.insertRow(1); 
var cell1 = row.insertCell(1); 
cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 
i++;} 

預先感謝您！

Answer 1

變化：

cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 

到：

cell1.innerHTML = "<input type='button' id='foo" + i + "' value='Hello'>"; 

Answer 2

你需要與你的遞增變量Concat的字符串，而不是把它裏面的字符串。

"<input type='button' id=foo" + i +" value='Hello'>" 

但是，還有更多你需要做的...... 你需要讓你的i變量是全球性的，因此不會被重置每次調用這個函數像這樣

var i = 1; 
function addrow() { 
    var table = document.getElementById("mytable"), 
     row = table.insertRow(i), 
     cell1 = row.insertCell(i); 
    cell1.innerHTML = '<input type="button" id=foo' + i + ' value="Hello">'; 
    i++; 
} 

我周圍也改變了引號，因爲單引號不被認爲是對HTML

有效語法

Answer 3

變化

cell1.innerHTML = "<input type='button' id='foo+i' value='Hello'>"; 

到

cell1.innerHTML = "<input type='button' id='foo"+ i +"' value='Hello'>"; 

和初始化i值作爲全局變量。

使用

var i = 1; 
function addrow() { 
    var table = document.getElementById("mytable"); 
    var row = table.insertRow(1); 
    var cell1 = row.insertCell(1); 
    cell1.innerHTML = "<input type='button' id='foo"+i +"' value='Hello'>"; 
    i++; 
}