如何通过jQuery选择使用javascript动态生成的innerHTML元素[重复]

Question

这是我的问题。 我需要使用 switch 函数生成动态不同的表单。 表单逐步显示，通过无线电输入提出几个问题，并为 anwser 提供一个值。

function myFunctionSwitch() {
switch(myVarValue) {
case "something":
text = "<div id=\"q1\">Question
<label>Answer<input class=\"reponse\" type=\"radio\" name=\"q1\" id=\"q1r1\" value=\"462\">
<span class=\"checkmark\">
</span>
</label>
<label><input class=\"reponse\" type=\"radio\"... 
<label><input class=\"reponse\" type=\"radio\"... 
<label><input class=\"reponse\" type=\"radio\"... 
</div>"
break;
 default:...
}
document.getElementById("myModalInside").innerHTML = text;

我尝试通过这种方式使用 jQuery 获取输入值：

$(document).ready(function(){   "use strict";
var result;
var value1;

$('#q1 .reponse').on('change', function(){  
    value1 = parseInt(this.value);
    result = value1 + ...;
});

这个 jQuery 代码在一个带有表单写入的 html 页面中完成了正确的工作。 但我需要我的 switch 函数来呈现不同的形式。 这就是我需要帮助的原因。

Answer 1

如果您想处理动态添加的元素上的事件，您需要以这种方式委托事件：

$(document).on('change', '#q1 .reponse' , function() {
    value1 = parseInt(this.value);
    result = value1 + ...;
});

更多信息here。