$(window).load Chrome,Safari 问题答案

【问题标题】：$(window).load Chrome,Safari problem$(window).load Chrome,Safari 问题
【发布时间】：2011-11-21 12:56:42
【问题描述】：

好的，问题来了

$(window).load(function () {
        \\Do something
    });

以及其他的变体在 chrom 和 safri 中不起作用。 FF，IE Opera 工作正常我搜索但没有找到任何工作解决方案有人知道如何在页面完成加载后检查 chrome、safari？

【问题讨论】：

如果这在 Chrome 或 Safari 中不起作用，我将在以前的项目上做很多工作......
如果它不起作用，你希望它做什么？

标签： jquery google-chrome safari load

【解决方案1】：

如果您想在页面加载时执行某些操作，可以尝试以下代码之一。

$(document).ready(function(){
    //Page loaded
});

或

$(function(){
    //Page loaded
});

编辑：试试这个

window.onload = function(){
   //Page loaded
};

或者如果你想使用 jQuery，那么试试这个

$(window).bind('load', function(){
   //Page loaded
});

【讨论】：

两者都做了不同于$(window).load(function() {});的事情。
@alecgorge - OP 正在寻找能够确保页面被加载并且我提供的代码将执行此操作的东西。
$(function(){//页面加载});等于 $(document).ready 与 $(window).load 非常不同
@ShankarSangoli 您提供的代码在DOM 准备就绪时运行传递的函数，一旦页面上的所有图像也加载，OP 提供的代码就会运行。因此，您的代码不能达到同样的目的。
@Yovo - 我知道它们都是一样的，所以我提到你可以使用其中任何一个。如果我没记错的话，我猜你想知道页面是否加载。

【解决方案2】：

window.load 和 document.ready 都为我工作，这是fiddle

【讨论】：

【解决方案3】：

我有一个页面可以在 FF 中正常加载，但在 Chrome 中无法正常工作，因为我有 2 个使用 $(window).load(function() 的脚本，而第 2 个脚本似乎在图像出现之前执行。

第一个脚本检查丢失的图像并替换错误图像：

   $(window).load(function() {
    $("img").each(function(){
      var image = $(this);            
      if(image.context.naturalWidth == 0 ||
      image.readyState == 'uninitialized'){   
         $(image).unbind("error").attr(
             "src", "assets/img/image_missing.jpg"
         );
      }
 });
});

第二个函数重新对齐一行中的元素，以防调整窗口大小（它是一个响应式页面）：

$(window).load(function() {
        columnConform();
});

当我在 Chrome 中对此进行调试时，第一个函数被执行，但是当第二个函数被执行时，任何丢失的图像都没有显示出来。它们仅在第二个功能完成后出现。

当页面首次加载时，找不到“Socketry”的图像，因此 Spanners/Metric/Imp 会立即显示在同一行的下方。

假设这是正确的，第二个脚本会重新对齐行，但是当显示“图像丢失”时，这会强制 Spanner 进入下一行。

“Image Missing”应该在行对齐之前显示，在这种情况下，行将正确对齐，就像在 Firefox 中一样。

*我会发布屏幕截图，但我没有 10 声望 - ggrrrhh！有时一张图片值 1000 字... *

我想我最好用文字来描述页面......

我有 13 张图片，每行显示 6 张，所以 2 行完整，1 张在第 3 行。无法找到第 6 张图像，因此第 7 张图像显示在顶行缺少图像符号的正下方，而不是第 2 行的第 1 张图像。第二个脚本对齐行，假设第 7 个图像在顶行，然后第一个脚本使“图像丢失”图像出现，这将第 7 个图像强制到第 2 行，它自己。加载所有图像后，需要执行第二个脚本。希望这是有道理的。

【讨论】：

【解决方案4】：

我认为这不会回答您的问题，但就我而言，load() 并不能单独在 Chrome 中工作，因为我试图加载到另一个 <form> 内的 <form>。 Chrome 完全忽略了内部<form> 的存在。

尝试下载未压缩版本的 jQuery 并对其进行调试。

【讨论】：

【解决方案5】：

在本地主机上工作时，这可能会在某些浏览器中发生（我在 Opera 和 Chrome 中体验过）。 “就绪”事件似乎在 javascript 有机会添加侦听器之前触发，因此它 $(window).ready 永远不会触发。

【讨论】：

见鬼，它在我的服务器上，它对 window.onload 没有任何影响...

【解决方案6】：

示例：当页面完全加载（包括图形）时运行函数。

  $( window ).load(function() {
         // Run code
         });

示例：每次加载图像时，将类 bigImg 添加到所有高度大于 100 的图像。

$( "img.userIcon" ).load(function() {
   if ( $( this ).height() > 100) {
     $( this ).addClass( "bigImg" );
   }
});

有关详细信息，请参阅http://api.jquery.com/load-event/。

【讨论】：

【解决方案7】：

试试这个方法：

$(document).ready(function(){
   //Do something
})

【讨论】：