Question

该脚本应该具有添加或删除部分的按钮。在该部分中，有一些按钮可以添加或删除一个名为“行”的子部分。我遇到的问题是将行按钮链接到它们创建的部分。即，无论它们属于哪个部分，它们都会在最后创建的部分中添加或删除。所以我尝试将sec参数添加到mod_row()，但似乎它始终是s的当前值，而不是创建按钮时s的值。< / p>

foo = document.createElement('p');
    var bar = document.createElement('button');
    bar.setAttribute('type','button');
    bar.onclick = function () { mod_row('add',s) };
    bar.appendChild(document.createTextNode('add row'));
foo.appendChild(bar);
    bar = document.createElement('button');
    bar.setAttribute('type','button');
    bar.onclick = function () { mod_row('del',s) };
    bar.appendChild(document.createTextNode('del row'));
foo.appendChild(bar);
section.appendChild(foo);

foo = document.createElement('div');
foo.setAttribute('id','magic_rows_'+s);
section.appendChild(foo);

function mod_row (mod,sec) {
    var row = "blah blah blah";
    var magic_rows = document.getElementById('magic_rows_'+sec);
    if (mod == 'add') {
        var new_p = document.createElement('p');
        new_p.setAttribute('id','row'+r);
        new_p.innerHTML = row;
        magic_rows.appendChild(new_p);
        r++;
    }
    else if (mod == 'del') {
        magic_rows.removeChild(magic_rows.lastChild);
        r--;
    }
}

Answer 1

在这两个地方你有一个经典的闭包问题：

bar.onclick = function () { mod_row('add', s) };
//...
bar.onclick = function () { mod_row('del', s) };

问题是这两个函数中的s是指外部作用域中的s所以当调用点击处理程序时，它们最终会使用任何值s当外部范围完成时。生成单击处理函数时，需要强制评估s。通常的方法是使用函数来生成回调函数：

bar.onclick = (function(inner_s) {
    return function() {
        mod_row('add', inner_s);
    }
})(s);
//...
bar.onclick = (function(inner_s) {
    return function() {
        mod_row('del', inner_s);
    }
})(s);

当您分配到s而不是inner_s被调用时，额外的功能评估层会强制bar.onclick进行评估（<{1}}。

即使在声称没有指针的语言中，你也无法摆脱指针的处理。

更新：这里有一个关于时髦的自动执行功能如何工作的说明。这样：

bar.onclick

在功能上等同于：

bar.onclick = (function(inner_s) {
    return function() {
        mod_row('add', inner_s);
    }
})(s);

调用function closure_hack(inner_s) { return function() { mod_row('add', inner_s); } } bar.onclick = closure_hack(s);时，会给出closure_hack，s是对某个对象的引用。然后，在s内，closure_hack引用inner_s引用的同一对象。在s之外，closure_hack可以更改为引用其他对象，但s仍然引用旧版本。函数调用 - 通过inner_s或惯用的自执行函数 - 只是将变量名称closure_hack与其引用的对象进行离婚的方法：目标是抓住s指的是s可以改变而没有不良副作用。

这很棘手，需要一些时间来适应。闭包让每个人都兴奋起来，不要因为有点困惑而感到难过。

在动态添加的部分中动态添加/删除部分

1 个答案: