“on”事件未使用动态内容触发

Question

我有以下代码，在事件中使用jquery 。

    $(document).on('click', 'a.test', function (event) {
        alert('');
    });

我的问题是，这不会触发通过ajax动态添加的内容：

$.ajax({
    url: ...,
    ...
    ..
    success: function(response) {

        var dom = $(response.d.html);
        myContainer.html(dom.find('#ajaxcontainer'));
    }
});

你可以帮我解决这个问题吗？我正在使用jquery.1.7.2.min.js

Answer 1

我没有任何奇怪的问题...我认为你可能需要在.on（'click'）事件上调用你的ajax函数。

jsFiddle link

var myContainer = $('body');

$(document).on('click', 'a', function () {
  $.ajax({
    url: '#',
    success: function(response) {
        // of course here i'm appending just a regular link, but your response data would include all that html
        myContainer.append('<a class="ajaxAdded">Click this</a>');

    }
  });
});

Answer 2

当$.ajax为异步函数时，on方法无法访问其创建的内容，因为该内容尚未准备就绪，您需要确保已经完成了要发射的事件的ajax请求，你可以做这样的事情来检查出来：

var done = false;
$.ajax({ /*bla bla bla*/ }).done(function(){ done = true; });

if(done){/* now you can fire the event */ }