Question

我找到了一个解决方案，但它不是最好的，所以我仍在寻找解决方案。请参阅我的答案，了解我的所作所为。

更新 - 我的错误仍然存在，如下所述但是如果我打开IE的开发者工具，则错误就会消失！如果我关闭浏览器并重新打开错误重新出现！

更新2 - 我试图将以下代码插入到我的JS中，看看是否可以解决问题而不是：

if (!("console" in window) || !("firebug" in console)) {
  var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml", "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];
  window.console = {};
  for (var i = 0, len = names.length; i < len; ++i) {
    window.console[names[i]] = function(){};
  }
}

然后这个：

var console = {};
console.log = function(){};

我还扫描了我的JS文件，但从来没有遇到会导致错误的console.log函数。

这是一个令人费解的问题，我会尽力解释。我在一个页面中设置cookie，在第一次访问时会显示一个灯箱。它适用于FF，Chrome等，但不适用于IE。

在IE中发生的是用于调用我的灯箱（彩盒）的脚本，但我看到的是AJAX Loader正在旋转并且内容从未加载。我发现剧本太快了。我正在使用$j(document).ready(function()我切换到：$j(window).load(function()并且一切似乎都很好并且它正常工作，直到我从另一个页面开始并进入上面提到的页面。

如果我从任何其他页面开始并点击链接我有同样的问题！ cookie工作正常，不会再次激活盒子。

换句话说，如果我清除cookie并从问题页面开始那么没问题。 BUT 如果我从任何其他页面开始（清除了cookie）并转到上面的页面，则颜色框无法正确加载。

据我所知，$j(window).load(function()无效。

我从IE收到没有错误。我正在使用IE 8进行测试，因为我使用的是Windows XP，所以无法测试9。（我被告知它在IE 9中工作正常，但尚未确认）脚本位于我的文档的<head>中。（如果我将脚本移动到<body>，它会完全打破页面。）

我已经阅读过DOCTYPE不正确或短缺的问题以及IE中的彩盒问题。我的DOCTYPE如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

非常感谢任何想法或想法！

这是我正在使用的代码：

的Javascript

var $j = jQuery.noConflict();
$j(window).load(function() {
  //window.onload = function() does not function properly either...
  if(!$j.cookie('gallerycookie')){
    $j.colorbox({
      inline:true, 
      href:"#gallery-nav-instruct"
    });
    $j.cookie("gallerycookie", 1, {
      expires: 30, 
      path: '/'
    });
  }
});

HTML

<div style="display:none">
  <div id="gallery-nav-instruct">
    <h2>Gallery Navigation Instructions - Step 1</h2><h2 style="text-align:right">
      <a style="text-align:right;" class="inline cw" href="
         #gallery-enlarge-instruct">Step 2</a></h2>
    <p>&nbsp;</p>
    <p class="white"><img src="/Images/Pages/gallery-navigation.jpg" width="890" height="450" alt="Gallery Navigation Instructions" /></p>
  </div>
</div>

<div style="display:none">
  <div id="gallery-enlarge-instruct">
    <h2>Gallery Navigation Instructions - Step 2</h2>
    <p>&nbsp;</p>
    <h2><a class="inline cw" href="#gallery-nav-instruct">Step 1</a> </h2>
    <p class="white"><img src="/Images/Pages/gallery-enlarge.jpg" width="890" height="510" alt="Gallery -Enlarged View Instructions" /></p>
  </div>
</div>

另一个注意事项：我在页面上使用jAlbum，我没有看到任何冲突，但可能有问题吗？我不能在这里发布该代码，因为它会超过SO的帖子限制。

要从this page开始触发此错误，系统会显示一个灯箱。点击Message Examples（灯箱左下角或菜单中没有灯箱的第一项）。

如果需要，这是指向page的直接链接。（直接转到页面不会触发错误。）

我尝试使用window.onload = function()并且发生了同样的问题。

我尝试使用事件处理程序在加载div后触发脚本，甚至根本不触发脚本。这是代码：

var $j = jQuery.noConflict();
$j('#gallery-nav-instruct').load(function() {
  if(!$j.cookie('gallerycookie')){
    $j.colorbox({
      inline:true, 
      href:"#gallery-nav-instruct"
    });
    $j.cookie("gallerycookie", 1, {
      expires: 30, 
      path: '/'
    });
  }
});

Answer 1

当您打开开发人员工具时它消失的原因是IE在任何console.log语句中都不能很好地使用，直到您打开开发人员工具。某处必须有console.log。它可以在您正在使用的任何插件文件或javascript文件中。由于某种原因，它会杀死之后运行的javascript。打开开发人员工具将console.log识别为javascript函数（我的最佳猜测），因此它突然起作用。

Answer 2

我刚刚遇到这个问题，虽然这个问题已经很老了，但我仍然希望将她的答案提交给未来的访客......

我的colorbox版本ColorBox v1.3.19.2似乎返回了某种控制台对象。这可能是您打开开发人员工具栏后问题消失的原因。

我的解决方案是改变colorbox脚本中的最后一个语句（可以用作缩小版本的开发）。该脚本以

结尾

}(jQuery, document, this, console));

我用

取代了

}(jQuery, document, this, null));

现在一切都适合我。

Answer 3

我似乎已经解决了这个问题，尽管我仍然对错误发生的原因感到困惑。我将解释我所做的事情：

首先，我使用Dreamweaver Teamplates创建我的网页。所以我的代码最终看起来像这样

<head> 
Template Content for head section then
<!-- TemplateBeginEditable name="head" -->
Content outside of template that goes in head section.
<!-- TemplateEndEditable -->
</head>
<body>
Template Content for Body
<!-- TemplateBeginEditable name="ContentArea" -->
Page or body content not inside template.
<!-- TemplateEndEditable -->
More Template Content for Body
</body>

最初我的脚本在head部分内部，如果我把它们放在关闭的body标签之前它打破了页面。我所做的是改变了代码的位置。我将Lightbox HTML放在<body>部分的顶部，然后脚本调用灯箱正下方，但在正文部分的页面内容上方，它工作正常！如果有人能够解释为什么这样有效并且可以帮助我理解为什么它不起作用请告诉我们。

Answer 4

我开始写这个作为对这个问题的评论，但它已经很长了，所以我决定把它写成答案。我不知道这是否能解决问题，但我认为值得尝试。

创建一个新功能setCookieAfterFirstView并在该功能中调用$j.cookie调用
在setCookieAfterFirstView彩色回调电话上调用onComplete功能。

这样，您可以确保其他任何调用都不会与colorbox打开冲突。也许有一个关于不同插件相互冲突的jQuery问题，我现在只是猜测..

var $j = jQuery.noConflict();

var setCookieAfterFirstView: function() {
    $j.cookie("gallerycookie", 1, {
        expires: 30,
        path: '/'
    });
};

$j(window).load(function() {
    //window.onload = function() does not function properly either...
    if (!$j.cookie('gallerycookie')) {
        $j.colorbox({
            inline: true,
            href: "#gallery-nav-instruct",
            onComplete:function() { setCookieAfterFirstView(); }
        });
    }
});

你是否可以尝试这个并对这个答案写评论，无论它是否解决了问题？

Colorbox在IE中无法正确加载

4 个答案: