IE7 jQuery(document).ready()问题

Question

我有一个页面在Firefox中可以完美运行，但在IE中会抛出错误。我正在动态加载jQuery（如果尚未加载），然后在jQuery（document）.ready（）块中执行一些操作。但是，当它到达jQuery（document）.ready（）块时，IE会抛出可怕的“对象期望”错误。

您可以在此处查看完整的页面代码：http://www.pastie.org/977767 IE在jQuery（document）.ready（）正好抛出错误。

有任何想法吗？再次强调，在Firefox中这完全可以正常工作。似乎IE认为已经加载了jQuery，但实际上还没有加载，或者在遇到jQuery（document）.ready（）块时仍在加载jQuery？

- Zendog74

Answer 1

当您将脚本附加到文档中时，它会异步下载。在IE中，下面的脚本...

try{
jQuery(document).ready(function() {
    jQuery.getScript("/CalendarViewer/js/utils.js", function(){
        jQuery.getScript("/CalendarViewer/js/groupcatselector.js", function(){
            jQuery.getScript("/CalendarViewer/js/calendarportlet.js", function(){
                jQuery.getScript("/CalendarViewer/js/calendarportletmain.js", function(){
                    var cpm = calendarportletmain;
                    cpm.doEditDefaults("V_7f208bca412b42a68c19eb104bf46f14", "/CalendarViewer", groupCats_V_7f208bca412b42a68c19eb104bf46f14);
                });
            });
        });
    });
});
}catch(err){
    alert("error in view.jsp="+err.number+" "+err.description);
}

在IE下载和解析jQuery脚本之前，该脚本已被解析并执行。如果Firefox已经缓存了该脚本，则情况可能不同，因为它不需要下载即可立即解析。这可能是因为解析器工作方式不同，Firefox在下载后立即解析该脚本，而IE则将解析排队，直到线程变为空闲为止。

您可以将此代码移动到setUpJquery函数的末尾，这意味着仅在jQuery对象可用时才会执行它。或者，您可以将代码放在自己的函数中，并从setUpJquery函数调用该函数。

- Andy E

---

谢谢，但你看到的代码实际上包含在几个不同的文件中。jQuery加载脚本在许多不同的页面上使用，因此我无法在其中放置特定的代码。是否有其他方法可以在jQuery(document).ready()上放置检查，并且只有在jQuery实际加载后才进行处理？ - Zendog74

@Zendog74：你可以将jQuery作为文档的同步部分。不要使用DOM来添加，而是使用类似于if (typeof jQuery == "undefined") document.write('<script src="jquery.min.js"></script>');的东西。这将确保在运行其他脚本之前获取jQuery。 - Andy E

谢谢...就是这样。虽然不太优雅，但它能用。我希望IE和FFX在加载外部脚本时能保持一致，唉。 - Zendog74

Answer 2

我解决这个问题的方法是：

$(document).ready( function () {
   document_init();
});

function document_init() {
  try{

    checkDivLoaded();

    [ ... do more stuff ... ]

  } catch( err ) {
    setTimeout('document_init()', 200);
  }
}

function checkDivLoaded() {
    if ( $('#targetDiv').length == 0) $jquery.error( 'not ready' );
}

虽然不太美观，但它能正常工作……它可以跨越多个文件，在我所知道的每个浏览器上（我关心的），这意味着您不必混乱父页面源代码。因此，您可以保持清晰而无需使用标签。

- snodgrass