jQuery事件不会在Handlebar模板上触发

Question

这是我第一次使用stackoverflow。希望每件事都有意义。

我正在使用tableTop.js和Handlebar从谷歌电子表格中获取数据。

当加载数据时，每一个都有一个关联的单选按钮，当被选中时需要触发一个事件(目前只有一个警告框)。

我的问题是，当我点击它时，什么也不会发生。

下面是演示http://jsfiddle.net/danieltramacchi/zgSvY/的链接

触发事件的代码

$(document).ready(function () {

    $(".sem-box").on("change", function () {

        var location = $(this).find("h3").html();
        alert(location);

    });
});

最初出现的单选按钮将触发警报，但如果您单击图像，它将删除它并从电子表格中拉入数据。

任何帮助都将不胜感激！

Answer 1

尝试：

$("#seminar").on("change", ".sem-box",function () {

    var location = $(this).find("h3").html();
    alert(location);

});

Answer 2

change方法在div元素上不起作用。

当元素的值发生更改时，会将更改事件发送给该元素。此事件仅限于input elements、textarea boxes和select elements。

http://api.jquery.com/change/

您可以尝试如下所示：

$(".sem-box").find('input[type=radio]').change(function () {
    //code
});

Answer 3

使用event delegation

$('#seminar').on('change', '.sem-box', function () {
  var location = $(this).find('h3').html();
  alert(location);
});