即使加载了 jquery，灯箱也不起作用
我正在尝试让灯箱在我的画廊上运行。 Jquery 可以工作，因为我通过在 documet.ready() 函数中使用 alert() 对其进行了测试。但除此之外，灯箱似乎不起作用。或者至少我只有链接正常工作。这是我的代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
<title></title>
<meta charset="UTF-8" />
<meta name="ROBOTS" content="ALL" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'>
<link href="/fuelcms/assets/css/klang.css?c=943916400" media="all" rel="stylesheet"/>
<base href="http://localhost/fuelcms/index.php" />
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<meta name="robots" content="index, follow" />
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/lightbox/prototype.js"></script>
<script type="text/javascript" src="assets/js/lightbox/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="assets/js/lightbox/lightbox.js"></script>
<link rel="stylesheet" href="assets/css/lightbox.css" type="text/css" media="screen" />
</head>
<body class="gallery index">
<!--<div class="header"><ul>
<li class="first"><a href="http://localhost/fuelcms/index.php/repertoire" title="Repertoire">Repertoire</a></li>
<li><a href="http://localhost/fuelcms/index.php/about" title="Über uns">Über uns</a></li>
<li><a href="http://localhost/fuelcms/index.php/kontakt" title="Kontakt">Kontakt</a></li>
<li><a href="http://localhost/fuelcms/index.php/agenda" title="Agenda">Agenda</a></li>
<li><a href="http://localhost/fuelcms/index.php/gallery" title="Gallerie">Gallerie</a></li>
<li class="last"><a href="http://localhost/fuelcms/index.php/links" title="Links">Links</a></li>
</ul>
</div>-->
<ul>
<li class="first"><a href="http://localhost/fuelcms/index.php/repertoire" title="Repertoire">Repertoire</a></li>
<li><a href="http://localhost/fuelcms/index.php/about" title="Über uns">Über uns</a></li>
<li><a href="http://localhost/fuelcms/index.php/kontakt" title="Kontakt">Kontakt</a></li>
<li><a href="http://localhost/fuelcms/index.php/agenda" title="Agenda">Agenda</a></li>
<li><a href="http://localhost/fuelcms/index.php/gallery" title="Gallerie">Gallerie</a></li>
<li class="last"><a href="http://localhost/fuelcms/index.php/links" title="Links">Links</a></li>
</ul>
<div class="fullpage">
<div class="colmask">
<div class="col3">
<div class="pagination"><a href="http://localhost/fuelcms/index.php/gallery/index/">‹ First</a> <a href="http://localhost/fuelcms/index.php/gallery/index/7"><</a> <a href="http://localhost/fuelcms/index.php/gallery/index/6">7</a> <a href="http://localhost/fuelcms/index.php/gallery/index/7">8</a><strong>9</strong></div><br><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Gong.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Gong_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Fatamorganaschatten.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Fatamorganaschatten_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Bumentopf2.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Bumentopf2_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blumentopfdynamik.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blumentopfdynamik_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blumentopf.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blumentopf_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blument1.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blument1_thumb.jpg" alt=""/></a></div></div></div><div class="footer" />
</body>
</html>
我也尝试过在 head 标签中使用 script 标签，但没有区别，请帮助。
希腊全能鲍勃
I'm trying to get lightbox to run on my gallery. Jquery works since I tested it by having an alert() in the documet.ready() function. But besides that lightbox doesn't seem to work. Or at least I only the links work normally. Here's my code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
<title></title>
<meta charset="UTF-8" />
<meta name="ROBOTS" content="ALL" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'>
<link href="/fuelcms/assets/css/klang.css?c=943916400" media="all" rel="stylesheet"/>
<base href="http://localhost/fuelcms/index.php" />
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<meta name="robots" content="index, follow" />
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/lightbox/prototype.js"></script>
<script type="text/javascript" src="assets/js/lightbox/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="assets/js/lightbox/lightbox.js"></script>
<link rel="stylesheet" href="assets/css/lightbox.css" type="text/css" media="screen" />
</head>
<body class="gallery index">
<!--<div class="header"><ul>
<li class="first"><a href="http://localhost/fuelcms/index.php/repertoire" title="Repertoire">Repertoire</a></li>
<li><a href="http://localhost/fuelcms/index.php/about" title="Über uns">Über uns</a></li>
<li><a href="http://localhost/fuelcms/index.php/kontakt" title="Kontakt">Kontakt</a></li>
<li><a href="http://localhost/fuelcms/index.php/agenda" title="Agenda">Agenda</a></li>
<li><a href="http://localhost/fuelcms/index.php/gallery" title="Gallerie">Gallerie</a></li>
<li class="last"><a href="http://localhost/fuelcms/index.php/links" title="Links">Links</a></li>
</ul>
</div>-->
<ul>
<li class="first"><a href="http://localhost/fuelcms/index.php/repertoire" title="Repertoire">Repertoire</a></li>
<li><a href="http://localhost/fuelcms/index.php/about" title="Über uns">Über uns</a></li>
<li><a href="http://localhost/fuelcms/index.php/kontakt" title="Kontakt">Kontakt</a></li>
<li><a href="http://localhost/fuelcms/index.php/agenda" title="Agenda">Agenda</a></li>
<li><a href="http://localhost/fuelcms/index.php/gallery" title="Gallerie">Gallerie</a></li>
<li class="last"><a href="http://localhost/fuelcms/index.php/links" title="Links">Links</a></li>
</ul>
<div class="fullpage">
<div class="colmask">
<div class="col3">
<div class="pagination"><a href="http://localhost/fuelcms/index.php/gallery/index/">‹ First</a> <a href="http://localhost/fuelcms/index.php/gallery/index/7"><</a> <a href="http://localhost/fuelcms/index.php/gallery/index/6">7</a> <a href="http://localhost/fuelcms/index.php/gallery/index/7">8</a><strong>9</strong></div><br><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Gong.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Gong_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Fatamorganaschatten.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Fatamorganaschatten_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Bumentopf2.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Bumentopf2_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blumentopfdynamik.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blumentopfdynamik_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blumentopf.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blumentopf_thumb.jpg" alt=""/></a></div><div class="imagebox"><a rel="lightbox[col]" href="assets/images/fotos_site/Blument1.JPG"><img src="http://localhost/fuelcms/assets/images/fotos_site/thumbs/Blument1_thumb.jpg" alt=""/></a></div></div></div><div class="footer" />
</body>
</html>
I've also tried with the script tag in the head tag but no difference, please help.
greez almightybob
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您正在使用 XHTML 进行编码（使用自结束标记），但未声明 XHTML 文档类型。检查 这个问题在SO
中，
，和关闭，无论是外部还是内部。我的 IDE (Aptana Studio 3) 就是这样做的（知道它有内置验证，在我看来它一定是“最佳实践”）虽然不确定，但我认为你可以省略
@< /code> 使用最新的 jQuery 选择灯箱时：$('a[rel*=lightbox]').lightBox()1.4 是多久以前的事？尝试更新的 jQuery 版本！
you are coding in XHTML (using self-closing tags) but not declaring the XHTML doctype. check this question in SO
<link>,<meta>and<base>are self-closing by itself, however,<script>should always be closed by a</script>for safety measures, regardless if external or internal. my IDE (Aptana Studio 3) does it that way (knowing it has built-in validation, it must be "best-practice" in my opinion)although not sure but i think you can omit the
@when selecting the lightbox using the latest jQuery:$('a[rel*=lightbox]').lightBox()how long ago was 1.4? try a more recent jQuery version!
我以前遇到过这个问题，并通过在结束正文标记之前添加以下内容来解决它：
也许这会对您有所帮助。
注意：这对我有用，使用 Google CDN 上托管的最新 jQuery (1.7.1)，并使用 Lightbox 2.05 位于在这里。您是否使用不同的 Lightbox 实现？如果没有，您肯定仍在使用非常旧的 jQuery 和 Lightbox 版本。
I've had this problem before and solved it by putting the following right before the ending body tag:
Maybe that will help you out.
Note: this worked for me using the most recent jQuery (1.7.1) hosted on Google's CDN, and with Lightbox 2.05 located here. Are you using a different Lightbox implementation? If not, you are definitely holding on to very old versions of both jQuery and Lightbox.