Javascript - Id值递增行不起作用并通过Id删除行
问题描述:
我已经创建了添加行,但是我的问题是,我创建的id值并没有增加。我只坚持1个结果。Javascript - Id值递增行不起作用并通过Id删除行
我也想包括删除行,所以每当我点击按钮“删除”具有特定ID的行将删除。
<script>
var rowID;
function myFunction() {
rowID++;
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
rowID=1;
cell1.innerHTML = "###";
cell2.innerHTML = "###";
cell3.innerHTML = rowID;
cell4.innerHTML = "<button id=''>Remove</button>";
}
在此先感谢
答
你需要以1添加到它与++运算符定义它,当你的变量设置为0。另外,在你的代码中删除ROWID = 1(它重置为1)如下:
<script>
var rowID = 0;
function myFunction() {
rowID++;
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
cell1.innerHTML = "###";
cell2.innerHTML = "###";
cell3.innerHTML = rowID;
cell4.innerHTML = "<button id=''>Remove</button>";
}
答
这是因为你把它回到这里
var cell4 = row.insertCell(3);
rowID=1; //<-- NOT NEED
cell1.innerHTML = "###";
移除此行。
这是jsFiddle。并与var rowID = 0;
答
初始化它,我认为你有几个错别字,请参见注释:
//rowId must be initialized to a number or you'll get Nan with rowId++
var rowID = 0;
function myFunction() {
rowID++;
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
//this is the reason of your bug
//rowID=1;
cell1.innerHTML = "###";
cell2.innerHTML = "###";
cell3.innerHTML = rowID;
cell4.innerHTML = "<button id=''>Remove</button>";
}
答
要设置rowID=1
所以每一次都会有值1
。你也需要设置rowID=0
如果要增加,否则,如果你don'y初始化它,它会导致NaN
<script>
var rowID;
function myFunction() {
rowID++;
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
rowID=1;
cell1.innerHTML = "###";
cell2.innerHTML = "###";
cell3.innerHTML = rowID;
cell4.innerHTML = "<button id="+rowID+" onclick='Remove(this)'>Remove</button>";
}
function Remove(btn){
btn.parentElement.parentElement.remove();
}
这里是jsfiddle
答
var rowID = 0;
function myFunction() {
rowID++;
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
//rowID=1;
cell1.innerHTML = "###";
cell2.innerHTML = "###";
cell3.innerHTML = rowID;
cell4.innerHTML = "<button id=''>Remove</button>";
}
- 初始化VAR ROWID 0声明期间(被认为是良好的做法)
- 你犯了一个愚蠢的错误,在函数本身分配rowid。
的jsfiddle:https://jsfiddle.net/z51z3jj1/2/
使用调试器,检查rowID'的'值。它会是'NaN'。 –
你设置了'rowID = 1;'半路向下 - 设置当你初始化变量(在你的函数之外) – Pete