如何为动态添加的复选框生成onclick事件？（Javascript）

我不熟悉html，通过youtube等网站学习。我正在编写一个Javascript，它允许我显示一个带有复选框和文本框（以及标签）的自定义窗口。首先，我取消了文本框的标记，但我希望在选中相应的复选框时启用它们

我在internet上搜索了一个解决方案，已经尝试使用：

document.getElementById（'chb1'）.onclick=function（）{//my function}
或

但两者都不起作用

function MyCheckboxWindow()
{
    this.render = function(func,titel,dialog,checktext1)
    {

        var dialogboxbody = document.getElementById ('dialogboxbody');
        dialogboxbody.innerHTML = dialog + ': <br>';

        if(checktext1 != null) 
        {

            dialogboxbody.innerHTML +='<br><input type="checkbox" id="chb1"><label for="chb1" class="lbl" id="lbl1"></label>'
            + '<label for="txt1">&#8364;</label> <input type="text" id="txt1" value="0,00" disabled>';
            document.getElementById('lbl1').innerHTML = checktext1 + ': ';
            document.getElementById('chb1').onclick = alert('');

        }
        else if(!checkboxCheck)
        {

            dialogboxbody.innerHTML +='<br><input type="checkbox" id="chb1"><label for="chb1" class="lbl" id="lbl1"></label>'
            + '<label for="txt1">&#8364;</label> <input type="text" id="txt1" value="0,00" disabled>';
            document.getElementById('lbl1').innerHTML = "Other: : ";
            document.getElementById('chb1').onclick = Change.ischanged('chb1');
            checkboxCheck = true;

        }

        document.getElementById('dialogboxfoot').innerHTML = '<button onclick="CheckboxWindow.ok(\''+func+'\')">Ok</button> <button onclick="CheckboxWindow.cancel()">Cancel</button>';

    }

}
var CheckboxWindow = new MyCheckboxWindow();

function CheckboxChanged()
{

    this.ischanged(id)
    {

        alert('');

    }

}
var Change = new CheckboxChanged();

函数MyCheckboxWindow（）
{
this.render=函数（func、titel、dialog、checktext1）
{
var dialogboxbody=document.getElementById（'dialogboxbody'）；
dialogboxbody.innerHTML=dialog+'：
；
如果（checktext1！=null）
{
dialogboxbody.innerHTML+='
'
+ '€ ';
document.getElementById（'lbl1'）。innerHTML=checktext1+'：'；
document.getElementById（'chb1'）。onclick=alert（''）；
}
如果（！checkboxCheck）
{
dialogboxbody.innerHTML+='
'
+ '€ ';
document.getElementById（'lbl1'）.innerHTML=“其他：：”；
document.getElementById（'chb1'）。onclick=Change.ischanged（'chb1'）；
checkboxCheck=true；
}
document.getElementById（'dialogboxfoot'）。innerHTML='Ok Cancel'；
}
}
var CheckboxWindow=new MyCheckboxWindow（）；
函数CheckboxChanged（）
{
此.ischanged（id）
{
警报（“”）；
}
}
var Change=new CheckboxChanged（）；

仅供参考，应该有6个复选框，但我在本例中遗漏了它们。此外，在“如果”中，我用警报替换了我的功能。if子句中的代码仅在我打开自定义窗口时生成一个alertbox，单击该复选框不会执行任何操作（只勾选该框）

像我在本例中的“else if”中那样编写它，根本不会产生任何结果，函数（）{Change.ischanged（'chb1'）；}（如我前面所说）也不会产生任何结果

请告诉我为什么这不起作用。可能还有更好的方法添加这些复选框，所以如果您知道任何复选框，请也让我知道

致以最良好的祝愿

Maximo
希望这有助于作为起点：


//动态创建一个复选框，并将其添加到div中。
//appendChild（）也适用于其他类型的HTML元素。
var div=document.getElementById（“div”）；
var checkbox=document.createElement（“输入”）；
checkbox.type=“checkbox”；
checkbox.id=“checkbox\u 1”；
div.appendChild（复选框）；
var textbox=document.createElement（“输入”）；
textbox.type=“text”；
textbox.disabled=true//以编程方式禁用文本框
div.appendChild（文本框）；
//每当单击复选框时（当用户选中或取消选中该复选框时），执行以下操作：
checkbox.onchange=函数（）{
if（checkbox.checked）{//如果现在选中了该复选框
控制台日志（“已检查”）；
textbox.disabled=false；
}
否则{
控制台日志（“未选中”）；
textbox.disabled=true；//以编程方式禁用文本框
}
}
谢谢您的回复，很抱歉这么晚才回复，我在过去两周很忙，没有太多时间

我试图使用您的示例代码，但无法使其正常工作。但是，我通过在if语句的输入中添加“onclick=“Change.ischanged（）”使其正常工作。我确信我以前尝试过类似的方法，但我可能错误地键入了“CheckboxWindow”或“CheckboxChanged”而不是“Change”

if(checktext1 != null) 
{

    dialogboxbody.innerHTML +='<br><input type="checkbox" id="chb1" onclick="Change.ischanged()"><label for="chb1" class="lbl" id="lbl1"></label>'
    + '<label for="txt1">&#8364;</label> <input type="text" id="txt1" value="0,00" disabled>';
    document.getElementById('lbl1').innerHTML = checktext1 + ': ';

}

if（checktext1！=null）
{
dialogboxbody.innerHTML+='
'
+ '€ ';
document.getElementById（'lbl1'）。innerHTML=checktext1+'：'；
}

我知道添加这样的对象不是最好的方式，但我似乎很难用你的方式实现我的目标

我还将“this.ischanged（id）”更改为“this.ischanged=function（）”（我也这样做了，所以我不再需要传递id）

if(checktext1 != null) 
{

    dialogboxbody.innerHTML +='<br><input type="checkbox" id="chb1" onclick="Change.ischanged()"><label for="chb1" class="lbl" id="lbl1"></label>'
    + '<label for="txt1">&#8364;</label> <input type="text" id="txt1" value="0,00" disabled>';
    document.getElementById('lbl1').innerHTML = checktext1 + ': ';

}