jquery-load - jquery .load() 并在新内容加载后触发函数？就像 JavaScript 的 onload 事件

Question

使用 jquery，我正在使用 jquery 的 .load() 交换网页中的一些内容功能。我想在内容实际加载后立即触发一个事件，但不是之前也不是之后。我准备好任何优雅的解决方案!为什么？在这种情况下，我正在使用旧的“淡出、交换内容、淡入”方法。我的问题？我想在新内容加载后立即淡出。

注意事项:

使用回调函数，如 $('#object').load(url, callback)立即触发 .load()函数成功执行(在实际加载内容之前)。在这里没用。

使用定时延迟淡入不是一个优雅的解决方案。非常“笨拙”，尤其是对于那些互联网连接速度更快的人。

JavaScript 的 onload事件触发器不起作用，因为 .load() 的元素正在改变的已经加载到 HTML DOM 中。

jquery的.ready()功能也不起作用，因为实际元素已经加载。

我不想创建 onload或 .ready()子容器元素，因为这是我实际尝试的一种解决方法，尽管它可能同样优雅或更多。

当(和 仅在 时)新的 .load() 时，我如何触发函数内容终于被加载了，就像 JavaScript 的 onload事件呢？非常感谢。

编辑 事实证明，jquery .load()功能完美无缺，我正在接近这个错误。

一旦.load()函数成功完成后，它调用程序员包含的任何“callback”函数，就像任何其他接受回调作为其“参数”之一的 jquery 函数一样。

.load()一旦出现错误或成功开始 HTML 替换和加载新内容，功能就完成了，但就是这样!然后，无论加载内容需要多长时间，但您的 .load在此之前通话已经完成。因此，期望回调在 .load 之后运行。已加载的内容只会让您失望。 ;)

我希望其他人可以像我一样从中吸取教训，包括那些认为我认为是这样的人。证明:如 jquery ajax .load page 中所述，回调在 时执行请求 完成，而不是在加载完成时。 Eureka 。哎呀。 /编辑

Answer 1

尝试使用不同的方法而不是 load() ，我建议使用 get() .像这样的东西可能对你更有用......

var jqxhr = jQuery.get(url,vars);

jqxhr.success(function(data){
    # This will only be called once the remote content has been loaded in
    # The data will then be stored in the data param and can be used within your site
});

jqxhr.error(function(data){
    # Something went wrong, never mind lets just handle it gracefully below...
});

我希望这是您的问题的解决方案!

如需更多信息，请参阅 http://api.jquery.com/jQuery.get/

我已经在下面快速创建了这个功能，它可能对你有帮助......它没有完善!

jQuery.fn.loadNewData = function() {

    var object = jQuery(this);
    var jqxhr = jQuery.get(arguments[0]);

    // check for success
    jqxhr.success(function(data) {
        // load the data in
        object.html(data);
    });

    jqxhr.error(function(){
        alert('Failed to load data');
    });
}

使用它，您可以调用与调用 load() 函数的方式相似的方式。

jQuery('#object').loadNewData(url);