javascript - 在 jsrender 模板内绑定(bind)事件

Question

添加的模板中的所有链接 .delete 和 .editRight 均无效。外部所有相同的链接都可以正常工作。

    $(document).ready(function () {
    AjaxGetAll();

    $(".delete").on("click", function () {
    //do stuff
    });

    $(".editRight").on("click", function () {
    //do stuff
    });

    function AjaxGetAll() {
    $.ajax({
    success: function (data) {
        if (data.hasOwnProperty("d")) {
            var favs = data.d;
            if (favs.length > 0) {
                $("#addedList").html(
                $("#addedTemplate").render(favs)
                );
            }
        }
});
}

<script id="addedTemplate" type="text/x-jsrender">
<div class="wrapright">
        <a id="editRight_{{>TimePin}}" class="editRight">Edit</a>
        <a id="deleteRight_{{>TimePin}}" class="delete">Delete</a>
</div>

Answer 1

使用基于 .on() 的事件委托(delegate)为动态添加的内容注册事件

$(document).on("click", '.delete', function () {
    //do stuff
});

$(document).on("click", '.editRight', function () {
    //do stuff
});