Question

我有一些工作，但由于我不习惯在JS中编码，我不知道这是否是正确的方法。

我有一个简单的：

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

通过调用myUrl，我会检索准备使用HTML（某些.offer div）然后我append到.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发表评论后，我删除了＆＃34; document.ready＆＃34;这里不需要。（请阅读评论）。

Answer 2

将事件处理程序放在ajax之外：

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

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

2 个答案: