Question

我正在尝试将数组添加到我的简单JavaScript计算器的onclick按钮中。

我的第一次尝试是代码中的process(text[i]);但它根本不起作用。

因此，我将数组项转换为字符串并赋予onclick函数。然后它以一种奇怪的方式运行。

你能告诉我怎样才能传递到正确的类型吗？

var text = ["+", "-", "*", "/", "SQRT", "POW", "RNDM", "MAX", "MIN"];

for (var i = 0; i < text.length; i++) {
  var child = document.createElement('button');
  child.innerText = text[i];
  child.value = text[i];
  var temp = text[i].toString();   //<-- convert to make sure it is string

  child.onclick = function () {                
    process(temp);   //<-- it doesn't work properly, and it won't accept "process(text[i])???".
  }

  label1.appendChild(child);
}        

document.body.appendChild(label1);

Answer 1

我必须离开我的电脑，但下面几乎正在工作。一旦进入设置的onclick，ops未定义。不知道为什么。希望其他人能够建立起来。

function process(operation) {
  alert(operation);
}

var ops = ["+", "-", "*", "/", "SQRT", "POW", "RNDM", "MAX", "MIN"];

for (var i = 0; i < ops.length; i++) {
  var child = document.createElement('button');
  child.innerText = ops[i];
  child.value = ops[i];

  (child.onclick = function() {

    process(ops[i]);
  })(i)

  // label1.appendChild(child);
  document.body.appendChild(child);
}

// document.body.appendChild(label1);

Answer 2

正如@adeneo已经很好地解释的那样，问题是所有onclick处理程序都使用相同的temp变量。为每次迭代提供单独范围的另一种方法是使用forEach方法而不是for循环：

["+", "-", "*", "/", "SQRT", "POW", "RNDM", "MAX", "MIN"].forEach(function(text) {
    var child = document.createElement('button');
    child.innerText = text;
    child.value = text;
    child.onclick = function () {
        process(text);
    }
    label1.appendChild(child);
});

示例： http://jsfiddle.net/kq1mpm3g/

将OnClick属性添加到数组javascript

2 个答案: