-1

我一直在试图弄清楚为什么这个“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--;
}
4

1 回答 1

1

主要问题是这一行：

document.getElementById("butons" + (y + 1)).onclick = function onclick(event) {
        stergeLinie(y);
}

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环形。这是关闭。这个问题的公认答案：JavaScript 闭包是如何工作的？对闭包给出了很好的解释。

于 2013-05-12T17:22:03.127 回答