jQuery on load 事件不触发脚本

Question

首先我查看了 onLoad 事件，但是当我读到它时，我发现我已经或将要被弃用，所以我搜索并找到了这个信息来使用 on 事件以检查图像是否已加载:load() method deprecated?

但是我将触发的简单动画不起作用。该元素不可见。如果我重新加载浏览器，它就会工作。在我添加加载事件之前，动画效果很好。可能出了什么问题，我该如何改进代码以使其更好地工作？

    $("#intro-img").on("load", function() {

    $(".intro-content").animate({
    left: '20px',
    opacity: '1.0'
    });

});

编辑:在我使用 window 而不是 id 后，脚本现在正在运行。像这样 $(window).on("load", function() {.... 现在脚本应该在页面上的所有内容都已加载后运行？但我想从来没有保证它能 100% 处理图像!？

Answer 1

$('#book').on("load",function(){
  //animate
});

这种方法的问题是当从缓存中加载图像时加载事件有可能永远不会被触发。当图像第一次下载时，jquery 可以有机会在图像加载和预期工作之前附加事件。但是如果图像通过缓存加载得如此之快，jquery 可能没有。

$('#book').on("load",function(){
  $(".intro-content").animate({
    left: '20px',
    opacity: '0.5',
    height:"300px"
    });
}).each(function(){
  if(this.complete) {
    $(this).trigger('load');
  }
});

此代码附加事件并检查图像是否已加载并触发加载事件。