我一直想弄清楚为什么这个'for'只循环一次。花了大约6个小时重写条件,我想知道你是否可以帮我找到问题。
提前感谢任何建议和时间!
var k;
var i = 1;
function stergeLinie(k) {
var tabel = document.getElementById('produse');
var rowCount = tabel.rows.length;
var row = document.getElementById("tr" + k);
row.parentNode.removeChild(row);
var t = rowCount;
for (y = k; y < t; y++) {
document.getElementById("nrcrtid" + (y + 1)).value = y;
document.getElementById("nrcrtid" + (y + 1)).name = "nr_crt" + y;
document.getElementById("nrcrtid" + (y + 1)).id = "nrcrtid" + y;
document.getElementById("prodid" + (y + 1)).name = "prod" + y;
document.getElementById("prodid" + (y + 1)).id = "prodid" + y;
document.getElementById("umid" + (y + 1)).name = "um" + y;
document.getElementById("umid" + (y + 1)).id = "umid" + y;
document.getElementById("cantitateid" + (y + 1)).name = "cantitate" + y;
document.getElementById("cantitateid" + (y + 1)).id = "cantitateid" + y;
document.getElementById("pretid" + (y + 1)).name = "pret" + y;
document.getElementById("pretid" + (y + 1)).id = "pretid" + y;
document.getElementById("pretfaraTVAid" + (y + 1)).name = "pretfaraTVA" + y;
document.getElementById("pretfaraTVAid" + (y + 1)).id = "pretfaraTVAid" + y;
document.getElementById("tvaid" + (y + 1)).name = "tva" + y;
document.getElementById("tvaid" + (y + 1)).id = "tvaid" + y;
document.getElementById("tr" + (y + 1)).id = "tr" + y;
document.getElementById("buton" + (y + 1)).id = "buton" + y;
document.getElementById("butons" + (y + 1)).onclick = function onclick(event) {
stergeLinie(y);
}
document.getElementById("butons" + y).id = "butons" + (y);
}
alert(y);
document.getElementById("tr" + i).style.height = "100%";
i--;
}
答案 0 :(得分:1)
主要问题是这一行:
document.getElementById("butons" + (y + 1)).onclick = function onclick(event) {
stergeLinie(y);
}
每次循环运行时{p> y
都会递增(y++
),所以当实际点击按钮时,y
具有最终迭代时的值 - 这只是足以使循环运行一次。
你遇到的另一个问题是这一行:
var rowCount = tabel.rows.length;
如果您的ID是从1开始的,那么最小的数字是1,而length
属性是0。如果有4行,则rowCount
将为3,这意味着您的循环永远不会达到4,因为条件为y < rowCount
。
以下是您的脚本的缩减版本:http://jsfiddle.net/trolleymusic/XTzjb/ - 我还必须在开始时运行一次,以便按照您正在执行的方式绑定点击。
这是一个正确循环的更新版本:http://jsfiddle.net/trolleymusic/Z8UYp/
var k;
var i = 1;
function stergeLinie(k) {
console.log("k: " + k);
var tabel = document.getElementById('produse');
// Add 1 to the rowCount because the elements have been assigned
// ids starting with 1, and length is 0-based
var rowCount = tabel.rows.length + 1;
var row = document.getElementById("tr" + k);
row.parentNode.removeChild(row);
var t = rowCount;
console.log(t, k);
for (var y = k; y < t; y++) {
console.log("Loop: " + y);
// If the elements don't exist anymore because they were removed
// skip the loop
if (!document.getElementById("butons" + (y + 1))) {
continue;
}
document.getElementById("butons" + (y + 1)).onclick = function onclick(event) {
// Get the number out of the
// id of the element that was clicked
var x = parseInt(this.id.replace("butons",""));
console.log("x: " + x);
stergeLinie(x);
}
}
}
下面有用地添加了 元话,您可以使用y
(http://jsfiddle.net/trolleymusic/dxy6N/)的封闭
for (var y = k; y < t; y++) {
(function (y) {
document.getElementById("butons" + (y + 1)).onclick = function onclick(event) {
console.log(y);
stergeLinie(y);
}
}(y));
}
看起来要复杂得多,但事实并非如此。您将所有操作放入另一个函数,并将y
的值作为参数传递给该函数 - 这意味着y
与y
的变量不同{{1}}你在循环中递增,它属于循环内的函数。这是关闭。这个问题的接受答案是:How do JavaScript closures work?给出了关闭的一个很好的解释。