在AJAX调用后访问DOM对象？

Question

我有一个典型的AJAX调用,它将一些HTML附加到当前页面.我希望能够使用典型的jQuery选择器访问新插入的HTML.

这里是想什么,我想能够做...

$.ajax({
   url: url,
   success: function(data) {
      $('body').append(data);
   }
});

$('#new_div').show();

#new_div将是我检索的数据中的一些HTML元素.我不一定要将事件附加到新元素(例如click),所以使用类似.load()或.on()不适用的东西(据我所知).

我尝试将$.ajax()调用设置为变量:var new_div = $.ajax(...)但这并没有让我到处都是.

Answer 1

如果您希望在将其插入DOM之后(或甚至之前)立即操作新内容,您也可以将其放入AJAX成功回调中:

$.ajax({
   url: url,
   success: function(data) {
      $('body').append(data);
      $('#new_div').show();
   }
});

另一方面,如果你想将处理程序绑定到将通过ajax添加到页面的内容,jQuery会这样做:

$(document).on('click', '#new_div', function(){
  alert("This function is bound to all #new_div's click events, even if they are added to the DOM via ajax later!")
});

Answer 2

怎么样：

$.ajax({
   url: url,
   success: function(data) {
      $('body').append(data).find('#new_div').show();
   }
});