javascript - 通过ajax调用更新DOM后，jQuery on click事件丢失

Question

我有一些工作，但由于我不太习惯用 JS 编写代码，所以我不知道这是否是正确的方法。

我有一个简单的:

<div class="offers"></div>

通过调用 myUrl，我检索准备使用的 HTML(某些 .offer div)，然后将其附加到 .offers div。 但我想在这些新附加的 .offer

上有一个点击事件

$.ajax({
    'url': myUrl,
    success: function(data){
        offers.append(data);
        $('.offer').on('click', function(e) {
            e.preventDefault();
            $('.offers .offer').removeClass('selected');
            $(this).addClass('selected');
        });
    }
});

感谢您的专业知识!

Answer 1

您可以简单地尝试一下:

$(document).on('click', '.offers .offer', function(e) {
    // Code here
});

理想情况下，出于性能目的，请将 文档 替换为 DOM 上最接近的 ID。

更新:在 A. Wolff 发表评论后，我删除了此处不需要的“document.ready”。 (请阅读评论)。