Javascript 如何处理动态元素中的事件？

我想创建一个动态问卷，动态加载下一个问题，但是当我加载第二个问题时，按钮next2的事件不会像没有事件一样响应

我想这是因为我用JavaScript函数加载了输入。我该怎么做才能让它工作

$（文档）.ready（函数（）{
变量问题2=`
`;
变量问题3=`
`;
$（“#下一步”）。单击（函数（e）{
e、 预防默认值（）；
控制台日志（1）；
$（“.questions”）.html（问题2）；
});
$（“#next2”）。单击（函数（e）{
e、 预防默认值（）；
$（“.questions”）.html（问题3）；
});
$（“#next3”）。单击（函数（）{
警惕（“冷静”）；
});
});

下一个
您应该使用
$（文档）
。它是文档中任何单击事件的函数触发器。然后在内部可以使用jquery
（“click”、“#idname”、somefunction）
，其中第二个参数指定要针对的特定元素。在这种情况下，身体内的每个元素

 $(document).on('click', '#next', function(e) {
    e.preventDefault();
    $(".questions").html(question2);
  });

对于所有这些，您只需要一个事件处理程序，而不是多个

您正在使用类
questions
和
$（“.questions”）.HTML将HTML插入元素中。假设您应该使用
questions
类将事件处理程序挂接到该元素，以便尽可能靠近该元素（而不是让它遍历整个DOM以查找事件中的内容）

在这里，我将当前的html保存到
myApp
，我创建它是为了保存内容而不污染全局名称空间；然后我在最后一次循环回到它。奇怪的是，你有
按钮
和
输入
键入submit，但我也处理了它。因为这些是表单中的提交按钮，我添加了
提交
事件，以防它被触发


$（函数（）{
让myApp={}；
myApp.question2=`我2岁了
`;
myApp.question3=`我3岁了
`;
myApp.question1=$（“.questions”）.html（）；//仅用于存储它
$（“问题”）
。在（'单击提交'，'表单，按钮[type=“submit”]，输入[type=“submit”]”，功能（事件）{
event.preventDefault（）
设d=$（this.data（'nextthing'）；
$（event.delegateTarget）.html（myApp[d]）；
返回false；
});
})；

下一个
而不是使用
。单击（）
，您可以尝试分配
onclick=nextclick（）
，然后调用分配html的“nextclick（）”函数。