IE JQuery 就绪功能不起作用答案

【问题标题】：IE JQuery ready function not workingIE JQuery 就绪功能不起作用
【发布时间】：2012-01-13 19:18:09
【问题描述】：

显然很多人都遇到过这个问题，但我还没有找到可行的解决方案。

我有一些代码需要在页面加载后运行，所以我把它放在下面的块中：

$(document).ready(function() {
    alert("Running initialization");
    initialize();
});
function checkDivLoaded() {
    if ( $('#footer').length == 0) $.error( 'not ready' );
}
function initialize() {
    try{
        checkDivLoaded();
        ...more code here
    } catch (err) {
        setTimeout(initialize, 200);
    }
}

这在所有浏览器中都可以正常工作，IE 除外。在那里，代码根本不执行。

此代码位于页面上我可以放置的最低点（使用 Zend 框架和页面特定的 ready() 函数意味着它可以在页面上的最低位置进行限制）。我检查了 js 文件的包含，这些文件都是从本地版本加载的，它们都有表单

<script type="text/javascript" src=""></script>

有什么想法吗？

注意

当我在 IE 中打开调试器时，它开始正常工作。

【问题讨论】：

“..more code here”包含什么？
不要将字符串传递给setTimeout。
您的src 是否为空，这会导致问题。我假设你给了它一个真实的 URL，对吧？
...更多代码是一大堆代码，但 IE 并没有走那么远。在调用 initialize() 之前向 $(document).ready() 添加警报不会被触发。 @Rocket src 不是空的——我只是说明了包含的格式，因为有些人提出这是 IE 中的一个潜在问题。
@Elie：好的，我只是在检查：-P

标签： jquery internet-explorer

【解决方案1】：

我认为这里没有任何问题，但我想指出几点。

在我这样做之前，请检查 IE 的 JavaScript 控制台，我猜早期的脚本有错误，这就是为什么这个脚本永远不会运行。

您实际上可以直接使用$(function(){})，而不是$(document).ready(function(){});。不过应该没什么区别。

另外，请不要将字符串传递给setTimeout（它们在全局范围内得到eval'd），传递一个函数。

setTimeout(initialize, 200);

另外，你确定你声明了$jquery（不应该是$.error）吗？

<script type="text/javascript">
   $(function() {
       initialize();
   });
   function checkDivLoaded() {
       if ($('#footer').length == 0){
          $jquery.error( 'not ready' );
       }
   }
   function initialize() {
       try{
           checkDivLoaded();
           //...more code here
       } catch (err) {
           setTimeout(initialize, 200);
       }
   }
</script>

编辑：如果您使用的是 IE8 或更低版本，它不会添加 console，除非调试器已打开（我希望任何认为这是个好主意的人都被解雇了）。如果您的其中一个包含使用console.log，它将是undefined，从而停止所有脚本执行。

尝试将其添加到页面顶部：

window.console = window.console || {log:function(){}};

它将创建一个“假”console 对象，以便定义 console.log。

【讨论】：

我按照您建议的方式更新了 setTimeout，并将 $jquery 替换为 $，但它不起作用。我在第一次调用初始化之前添加了一个 alert()，它没有在 IE 中触发。
@Elie：检查控制台，可能早期的脚本正在死去。此脚本中没有任何内容会导致 ready 事件不触发。
@Elie：你的代码中有console.log吗？我知道 IE（我认为是 8），除非调试器打开，否则不会添加 console 对象（愚蠢，我知道，但它是 IE）。
没有。我没有在脚本中放置任何直接登录。我想知道它是否实际上已经修复了一段时间，并且存在一些缓存问题，或者它是否仍然损坏！
不——这是调试器的问题。当我关闭一个重新打开整个窗口时，它又回到了问题。

【解决方案2】：

刚刚遇到同样的问题。试图找出问题所在，差点让我的大脑崩溃。

变得非常简单 - 之前执行的一些代码使用了 console.log(...)，但除非启用了开发工具，否则它不会在 IE 中定义。

修复很简单 - 在使用第一个 console.log 之前删除/注释 console.log 或将此代码添加到您的文件中：

if (typeof console === "undefined"){
    console={};
    console.log = function(){};
}

【讨论】：

这是最简单的答案

【解决方案3】：

使用(function($) {})(jQuery); 为我解决了这个问题。

(function($) {
  // body code
})(jQuery);

【讨论】：

【解决方案4】：

试着把你的

$(document).ready(function...

在代码的底部。可能是 IE 在调用 ready 函数之前没有解析 initialize() 代码。

【讨论】：

函数声明是 hoisted 到其封闭范围的顶部。
正如我在问题中提到的 - 脚本尽可能位于文件的最下方，但由于框架的原因，它们实际上不能位于底部。但是，这些脚本在文件中位于它们影响的任何元素的下方。

【解决方案5】：

在页面顶部的两行下方写下。

    window.console = window.console || {log:function(){}};
    if (typeof console === "undefined"){
        console={};
        console.log = function(){};
    }

这解决了我的问题

【讨论】：

【解决方案6】：

不知道我在哪里找到了这个解决方案，但这确实适用于我的 IE10。

我的项目中的一个例子：

var windowOnload = window.onload || function() {
                $('.toInitiate')[0].click();
                 $('a').click(function() {

                        if(this.className.indexOf("collapse") == -1)
                        {
                            $('.active').removeClass('active');
                            $(this).parent().addClass('active');
                            var className = $(this).parent().attr('class');
                        }
                    });

            };

            window.onload = function() {
                windowOnload(); 
            };

这些代码在加载完所有 html 内容后执行。

【讨论】：

【解决方案7】：

这对我有用。我换了

$(document).ready(function...

与

jQuery(document).ready(function...

【讨论】：