在div问题中插入Ajax内容

Question

当我使用ajax获取内容时，我有一个小问题。问题是，一旦成功事件触发，我将内容加载到div并调用一个函数

$('.content').html(data);
$('.image').resize(function(e) { more code.... });

嗯，问题是当第二行被执行时，内容还没有准备好，所以没有效果。

在这种情况下我该怎么办？

感谢。

Answer 1

将第二行放在回调函数中并使用.load来完成第一部分：

$('.content').load(<ajax url here>, function () {
  $('.image').resize(function (e) {
    // do whatever else you need to do here
  });
});

Answer 2

如果问题是您正在将事件附加到尚未在DOM中的事物（由于AJAX加载），您可以使用委托的事件处理程序。

这假设所有.image元素都在.content元素内。你可以这样做：

$('.content').on('resize', '.image', function(e) { ... });

请参阅jQuery .on()事件注册语法。这将监听resize元素中所有.image元素的.content事件，即使它们是动态添加的（即通过AJAX）。