1

我正在使用 Jquery 1.8.0 创建横幅旋转器插件,并且我的代码在 Firefox 和 chrome 中正常工作,但在 IE9 中神秘地有时无法正常工作,原因不明。我的意思是,横幅根本不会出现,也不会出现错误。它根本不存在。

所以我在我的代码中添加了一些警报(更改为console.log)以跟踪代码失败的位置,我想我找到了哪里。

页面上的html代码:

<div class="content-top">
    <div id="bannerRotator"></div>
</div>
<div class="content-bot">
</div>

页面上的javascript代码:

$(document).ready(function() {
    console.log("Before banner rotator");
    $("#bannerRotator").BannerRotator({
        BRBannerImages: ["../Images/Banners/banner1.jpg",
                        "../Images/Banners/banner1-b.jpg",
                        "../Images/Banners/banner2.jpg",
                        "../Images/Banners/banner2-b.jpg",
                        "../Images/Banners/banner3.jpg",
                        "../Images/Banners/banner3-b.jpg",
                        "../Images/Banners/banner4.jpg",
                        "../Images/Banners/banner4-b.jpg",
                        "../Images/Banners/banner5.jpg",
                        "../Images/Banners/banner5-b.jpg",
                        "../Images/Banners/banner6.jpg",
                        "../Images/Banners/banner6-b.jpg"]
    });
    console.log("After banner rotator");

    $("#white-bg").css({ height: $(document).height() });

    console.log("After white bg");
});

横幅旋转插件:

(function($) {

    $.fn.BannerRotator = function(options) {
        console.log("banner creation: begin");
        var opts = $.extend($.fn.BannerRotator.defaults, options);
        console.log("before foreach");
        return this.each(function() {
            alert("before this");
            // Commented out code
            alert("banner creation: end");
        });
        console.log("after foreach");
    };

    $.fn.BannerRotator.defaults = {
       // Default settings
    };

    // Other functions

})(jQuery);

执行此代码时,alert("after foreach");永远不会出现,这是完全正常的。问题是有时它会全部工作,但在其他时候我得到的最后一个警报是alert("before this");然后我直接进入alert("After banner rotator");.

我看到的最后一件事是,当插件工作时,content-bot可以在警告框后面看到里面的内容,而当插件失败时,我看不到content-bot,但bannerRotator会显示之前的所有内容。这使我认为它可能与$(document).ready功能有关,因为似乎当插件失败时,它会因为$(document).ready触发得太早而失败。

更新

这是我注意到的另一件事。当我第一次打开我的页面时,我的横幅没有出现。没有。不管我刷新多少时间,还是什么都没有。但是当我按 F12 进入开发者工具窗口时,横幅就起作用了。它仍然不是一直有效,但大多数时候它确实有效。

没关系那部分。正是console.log导致该问题的原因。请参阅为什么 JavaScript 仅在 IE 中打开开发人员工具一次后才能工作?

4

1 回答 1

2

尝试使用 Jquery 1.7.2

Ie9 上的 document.ready 事件有回归

http://bugs.jquery.com/ticket/12282

于 2012-08-28T22:45:33.010 回答