0

我试图在使用 javascript 库“lytebox”加载网页时打开一个灯箱

这是我的代码

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />

<script>
    function ShowIntro()
    {
        $lb.launch('example.jpg','showPrint:true','Orion Nebula','This is my description, which is optional');
    }
</script>

</head>


<body onLoad="ShowIntro()">
</body>
</html>

该代码在 firefox 和 chrome 上运行良好,但在 internet explorer 8 上它不起作用,我收到以下错误:

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET4.0E)
Timestamp: Sat, 24 Sep 2011 05:10:04 UTC


Message: '$lb' is undefined
Line: 12
Char: 3
Code: 0
URI: file:///C:/Users/User/Desktop/lytebox_v5.1/lytebox.html

我该如何解决?

ps 我正在使用 lytebox,因为它不需要 jquery,而且我不想与页面上的其他部分发生冲突(例如“videolightbox”)

4

1 回答 1

2

这里有一个猜测:Lytebox 使用window.onload自身来设置变量(您可以在脚本$lb的最后看到这一点),当您这样做时,您基本上是在 Lytebox有机会触发之前破坏了它的函数。这是另一个 SO question,似乎证实了 IE 中的这种行为。<body onload"...">window.onload

onload那么,当 Lytebox 需要自己的事件时,如何添加事件呢?西蒙威利森实际上在七年前的一篇相当经典的文章中提出了一个解决方案。在您的情况下,他的建议很容易实施:

<body><!-- no onload --->
  <script>
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = ShowIntro;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      ShowIntro();
    }
  }
  </script>
</body>
于 2011-09-24T05:58:24.123 回答