JavaScript 闭包，只是没有得到它

Question

我正在尝试迭代添加输入，并能够对每个输入独立运行计算，但似乎无法应用闭包原则。计算功能仅适用于最后添加的项目。我尝试过在主函数(addIt())内部和周围使用 for 循环，但它似乎只会让事情变得更糟...... 这是基本的 html:

<button class="btn btn-default btn-block" onClick="addIt('Item'+count)">Add One</button>

<form>
     <div id="itemForm"></div> 
<form>

这是我过于复杂和不优雅的js(顺便说一句，我愿意接受更好的方法来做到这一点，所以请毫不犹豫地跳过这个):

count = 0;
        addIt = function(p) {
                count++;
                var itFrm = document.getElementById("itemForm");
                var itDiv = document.createElement("div");
                var children = itFrm.children.length + 1
                itDiv.setAttribute("id", "itemDiv")
                itDiv.appendChild(document.createTextNode(p));
                itFrm.appendChild(itDiv);

                var remove = document.createElement("a");
                var linkText = document.createTextNode("Remove It");
                remove.setAttribute("href", "#");   
                remove.setAttribute("onClick", "removeIt()");
                remove.appendChild(linkText);

                var brk = document.createElement("br");

                var num = document.createElement("input");
                num.setAttribute("id", "numInput"+count);
                num.setAttribute("type", "number");
                num.oninput = function () {
                                var numInput = document.getElementById('numInput'+count).value ;    
                                var divisor = 10;
                                var result = document.getElementById('result'+count);   
                                var myResult = (Number(numInput) / Number(divisor));
                                result.value = myResult;
                                };
                num.setAttribute("placeholder", "Set number...");

                var clc = document.createElement("input");
                clc.setAttribute("id", "result"+count);
                clc.setAttribute("readonly", "readonly");
                clc.setAttribute("placeholder", "After Calculation...");

                var hr = document.createElement("hr");

                itDiv.appendChild(remove);
                itDiv.appendChild(num);
                itDiv.insertBefore(brk, num);
                itDiv.appendChild(clc);
                itDiv.appendChild(hr);
            };

            function removeIt(elem) {
                var elem = document.getElementById('itemDiv');
                elem.parentNode.removeChild(elem);
                return false;
            };

我尝试设置 jsfiddle here但由于某种原因，removeIt 函数在那里不起作用，尽管它在我本地工作，但仅删除最旧的迭代。任何关于我如何搞砸的想法都受到欢迎和赞赏。

Answer 1

    var countString = count.toString();   
    num.oninput = function() {
    var numInput = document.getElementById('numInput' + countString).value;
    var divisor = 10;
    var result = document.getElementById('result' + countString);
    var myResult = (Number(numInput) / Number(divisor));
    result.value = myResult;   };

这是计数的范围问题。它基本上是一个全局变量，所以闭包会寻找它。使用在每次按下按钮时重新声明的局部变量来修复它。