Javascript 选中生成的HTML复选框或单击事件绑定

我已经通过js生成了复选框：

 anwsersCount = question.ChoiceQuestionAnwsers().length;
 questionBodyContainer = document.getElementById('questionBody');
            //self.ChoosedQuestionAnwsers = question.ChoiceQuestionAnwsers;
            for (var i = 0; i < anwsersCount; i++) {
                var newOption = document.createElement("input");
                var newOptionLabel = document.createElement("label");
                newOption.type = "checkbox";
                newOption.id = i;
                newOption.value = i;
                newOptionLabel.for = i;
                newOptionLabel.setAttribute("style", "margin-left: 5px");
                newOption.onclick = function(event) {
                    alert('alert');
                };
                newOptionLabel.innerHTML = question.ChoiceQuestionAnwsers()[i].Text;
               // questionBodyContainer.innerHTML += question.ChoiceQuestionAnwsers()[i].Text + "<p>";
               // questionBodyContainer.appendChild(newOption); 
                questionBodyContainer.appendChild(newOption);
                questionBodyContainer.appendChild(newOptionLabel);
                questionBodyContainer.innerHTML += "<p>";

                //self.ChoosedQuestionAnwsers.push(question.ChoiceQuestionAnwsers()[i]);
            }

anwsersCount=question.ChoiceQuestionAnwsers（）.length；
questionBodyContainer=document.getElementById（'questionBody'）；
//self.ChoosedQuestionAnwsers=question.ChoosedQuestionAnwsers；
对于（变量i=0；i

生成的复选框的onclick事件不起作用。你有什么办法让它工作吗？

替换

newOption.onclick = function(event) {
                    alert('alert');
                };

与：

在创建它们之后尝试绑定它们：

anwsersCount = 5;
questionBodyContainer = document.getElementById('questionBody');

for (var i = 0; i < anwsersCount; i++) {
    var newOption = document.createElement("input");
    var newOptionLabel = document.createElement("label");
    newOption.type = "checkbox";
    newOption.id = i;
    newOption.value = i;
    newOptionLabel.for = i;
    newOptionLabel.setAttribute("style", "margin-left: 5px");
    newOptionLabel.innerHTML = "Dummie Text";
    questionBodyContainer.appendChild(newOption);
    questionBodyContainer.appendChild(newOptionLabel);
    questionBodyContainer.innerHTML += "<p>";
}

checks = questionBodyContainer.getElementsByTagName("input");
for (var i = 0; i < checks.length; i++)
{
    checks[i].addEventListener('click', function() {
          alert(this.getAttribute("id"));
    });
}

---

完美！谢谢：）你能解释一下为什么这个在新的循环中有效吗？我正在学习JS:）这在循环中不起作用的原因是，在DOM中添加元素后，通过添加具有innerHTML属性的新段落来修改DOM。删除它，您应该能够在for循环中添加事件侦听器。好啊谢谢你的解释：）

anwsersCount = 5;
questionBodyContainer = document.getElementById('questionBody');

for (var i = 0; i < anwsersCount; i++) {
    var newOption = document.createElement("input");
    var newOptionLabel = document.createElement("label");
    newOption.type = "checkbox";
    newOption.id = i;
    newOption.value = i;
    newOptionLabel.for = i;
    newOptionLabel.setAttribute("style", "margin-left: 5px");
    newOptionLabel.innerHTML = "Dummie Text";
    questionBodyContainer.appendChild(newOption);
    questionBodyContainer.appendChild(newOptionLabel);
    questionBodyContainer.innerHTML += "<p>";
}

checks = questionBodyContainer.getElementsByTagName("input");
for (var i = 0; i < checks.length; i++)
{
    checks[i].addEventListener('click', function() {
          alert(this.getAttribute("id"));
    });
}

anwsersCount = 5;
questionBodyContainer = document.getElementById('questionBody');
for (var i = 0; i < anwsersCount; i++) {
    var newOption = document.createElement("input");
    var newOptionLabel = document.createElement("label");
    newOption.type = "checkbox";
    newOption.id = i;
    newOption.value = i;
    newOptionLabel.for = i;
    newOptionLabel.setAttribute("style", "margin-left: 5px");
    newOptionLabel.innerHTML = "Dummie Text";
    questionBodyContainer.appendChild(newOption);
    questionBodyContainer.appendChild(newOptionLabel);
    questionBodyContainer.appendChild(document.createElement("p"));
    newOption.addEventListener('click', (function()
                                         {
                                             alert(this.getAttribute("id"));
                                         }), false);
}