表中的事件侦听器

Question

我正在尝试创建一个汇总表，其中从属元素将汇总到其父元素。每个元素都包含一个与其父元素的id相等的类。我已将事件侦听器添加到表的每个元素中，以便求和将沿树向上。该代码大致如下：

        for (i = 1; i < (x.length-3); i++) {
            x[i].addEventListener("change", function(e) {
                if (x[i].tagName == "TD") {
                    document.getElementById("y0_" + x[i].className).innerHTML = 
                        String(parseInt(document.getElementById("y0_" + x[i].className).innerHTML) + parseInt(x[i].innerHTML));
                    }
                if (x[i].tagName == "INPUT") {
                    document.getElementById("y0_" + x[i].className).innerHTML = 
                        String(parseInt(document.getElementById("y0_" + x[i].className).innerHTML) + parseInt(x[i].value));
                    }
            }, false);
        };

当我在控制台中检查单个表元素时，直接父元素将被更新，而其他祖父母元素不会被更新。但是，当我运行该页面时，什么也没有发生（并且没有错误报告）。有任何提示吗？

Answer 1

此问题似乎与closures有关。您可以使用以下方法修复它：

var x = document.getElementsByName("item.AmountY0");
for (i = 1; i < (x.length - 3); i++) {
   (function() {
      var elm = document.getElementById("y0_" + x[i].className);
      x[i].addEventListener("change", function(e) {
         if (x[i].tagName == "TD") {
            elm.innerHTML = String(parseInt(elm.innerHTML) + parseInt(x[i].innerHTML));
         }
         if (x[i].tagName == "INPUT") {
            elm.innerHTML = String(parseInt(elm.innerHTML) + parseInt(x[i].value));
         }
      }, false);
   }());
};