JS创建了带有用于单击事件未接来电的参数的按钮

时间:2018-10-26 07:57:10

标签: javascript jquery html function parameters

我根据js输入的值在html中创建一些按钮。 因此,很容易,如果输入为5,则我绘制5个按钮,文本从1到5。

这些按钮需要调用作为每个按钮的计数器输入的函数(button1传递1到被调用函数,button2传递2,...)。

这是问题所在:所有按钮在被调用时都以相同的输入来调用该函数(在示例中,所有值均为5)。

为什么?这是我写的:

var toAdd = document.createDocumentFragment();
for (var i = 0; i < nErog; i++) {
    var newDiv = document.createElement('div');
    newDiv.id = 'e' + i;
    //newDiv.className = 'ansbox';
    newDiv.style.margin = "20px";
    newDiv.style.fontSize = "350%";
    newDiv.style.fontWeight = "bold";
    toAdd.appendChild(newDiv);
}
document.getElementById('erogs').appendChild(toAdd);

for (var i = 0; i < nErog; i++) {
    $("#e" + i).dxButton({
        text: i + 1,
        onClick: function () {
            RetrieveErogs(i+1);
        },
        height: "120px",
        width: "120px"
    });
}

RetrieveErogs在哪里

function RetrieveErogs(erogatore) {
    alert(erogatore);
}

所有按钮都以相同的值调用函数,所以我想我错过了指定onClick事件的内容,但是呢?

1 个答案:

答案 0 :(得分:1)

尝试将RetrieveErogs(i+1)替换为RetrieveErogs($(this).text())

或者,尝试使用闭包:

   (function(x){
      $("#e" + x).dxButton({
        text: (1+x),
        onClick: function () {
            RetrieveErogs(1 + x);
        },
        ...
      });
   })(i);