jQuery更改事件不适用于输入：handlebar.js模板中的单选按钮

我正在使用handlebar.js输出一系列问题/答案表单。每个问题只有一个答案，所以我使用

。下面的代码生成所需的结果，但是当选中单选按钮时，jQuery

change

事件不会触发

<script id="questions-template" type="text/x-handlebars-template">
{{#questions}}
{{questionIndex @index}}
<article class="question question-{{@index}} clearfix">
  <h2>{{question}}</h2>
  <form>
    {{#each answers}}
    <div class="answer">
      <input type="radio" name="radios[{{../questionIndex}}]" id="radios-{{../questionIndex}}{{@index}}" value="{{value}}">
      <label for="radios-{{../questionIndex}}{{@index}}"><span>{{answer}}</span></label>
    </div>
    {{/each}}
  </form>
</article>
{{/questions}}
</script>
<div id="questions"></div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.min.js"></script>
<script>
$(function(){
  var questions = {
    "questions": [
      { 
        "question": "Lorem ipsum dolor sit amet, consectetur adipiscing elit?", 
        "answers": [
          { 
            "answer": "Answer 1",
            "value": 1
          },
          { 
            "answer": "Answer 2",
            "value": 2
          }
        ]
      }
    ]
  };

  $(document).ready(function(event) {
    var
    source = $("#questions-template").html(),
    template = Handlebars.compile(source);
    Handlebars.registerHelper('questionIndex', function(value) {
      this.questionIndex = Number(value);
    });
    $('#questions').append(template(questions));
  });

  $('input:radio').change(function(event) {
    alert('change');
  });
});
</script>

{{{问题}
{{questionIndex@index}}
{{问题}
{{{#每个人都回答}
{{答案}
{{/每个}}
{{/问题}
$（函数（）{
变量问题={
“问题”：[
{ 
“问题”：“Lorem ipsum dolor sit amet，Concertetur Adipsicing Elite？”，
“答案”：[
{ 
“答案”：“答案1”，
“价值”：1
},
{ 
“答案”：“答案2”，
“价值”：2
}
]
}
]
};
$（文档）.ready（函数（事件）{
变量
source=$（“#问题模板”）.html（），
template=handlebar.compile（源代码）；
把手.注册表帮助器（'questionIndex'，函数（值）{
this.questionIndex=编号（值）；
});
$（“#问题”）.append（模板（问题））；
});
$（'input:radio'）。更改（函数（事件）{
警报（“变更”）；
});
});

您应该使用.on来分配事件处理程序-因为您的单选按钮是动态生成的。试试这个：

  $("#questions").on("change", "input:radio", function(event) {//assuming questions is already part of the DOM
    alert('change');
  });

这里的这个问题很好地解释了如何将事件处理程序附加到动态生成的元素