0

尝试使用 jQuery.LightBox 时出现此错误:

Uncaught TypeError: Object [object Object] has no method 'lightBox'

这是一个活生生的例子(在 div 中重建表格设计,不要讨厌。):

http://www.builderpreviews32.com/photos.php

是的,在 jQuery.LightBox 文件之前引用了 jQuery 文件。

这是我的代码:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta name='keywords' content=''>
<meta name='description' content=''>
<title></title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

</head>

    <link href="/common/styles/global.css" rel="stylesheet" type="text/css" />
<link href="/common/styles/lightbox.css" rel="stylesheet" type="text/css" />

<script src="/common/scripts/jquery-1.10.2.min.js"></script>
<script src="/common/scripts/lightbox-2.6.min.js"></script> 
<body>

    <div id="wrapper">
        <div id="header">
<a href="/"><img src="/common/images/lgo_lake.jpg" alt="Riss Lake Logo" /></a>
<div id="nav">
    <nav>
        <a href="/about.php">About Riss Lake</a>
        <a href="/developer.php">Developer</a>
        <a href="/developer.php">Communities</a>
        <a href="/awards.php">Awards</a>
        <a href="/areamap.php">Area Map</a>
        <a href="/developer.php">Inventory</a>
        <a href="/photos.php">Photos</a>
        <a href="/builders.php">Builders</a>
        <a href="/developer.php">Contact Us</a>
        <a href="/areainfo.php">Area Information</a>
    </nav>
</div> <!-- End Nav -->
</div> <!-- End Header -->          
        <div id="body">
            <!--MODULE:image_gallery.php|CACHE:main_photos-->

            <div class="lightbox">
                                <a href="/images/uploaded/115747639443725_poolside_sm.jpg"><img src="/images/uploaded/thumb_115747639443725_poolside_sm.jpg" alt=""

                                                            width="150" 
                                                    class="photo_edge" /></a>
                                <a href="/images/uploaded/115747639443725_poolside_sm.jpg"><img src="/images/uploaded/thumb_115747639443725_poolside_sm.jpg" alt=""

                                                            width="150" 
                                                    class="photo_edge" /></a>
                                <a href="/images/uploaded/115747639443725_poolside_sm.jpg"><img src="/images/uploaded/thumb_115747639443725_poolside_sm.jpg" alt=""

                                                            width="150" 
                                                    class="photo_edge" /></a>
                                <a href="/images/uploaded/960211759433150_002.jpg"><img src="/images/uploaded/thumb_960211759433150_002.jpg" alt=""

                                                            width="150" 
                                                    class="photo_edge" /></a>
                </div>
    <script type="text/javascript">$(function(){$('.lightbox a').lightBox();});</script>

        </div>

        <div id="footer">Copyright © 2003. <a href="/privacy.php">Privacy Policy</a> | <a href="/terms.php">Terms of Use</a></div>          
    </div> <!-- End Wrapper -->

</body>
</html>
4

2 回答 2

1

解决问题的几件事

  1. 使用浏览器调试器中的源选项卡检查您的脚本是否已加载。
  2. 尝试将脚本直接放在 jQuery 包含之下,因为它是依赖的。

确保您的脚本标签已关闭。

我最初的猜测是,这一定是由于脚本的顺序不正确,如果脚本被正确包含并在您使用浏览器调试器进行调试时加载。我之前也遇到过这个问题。

祝你好运哥们,让我知道它是否有效。

于 2013-08-06T13:32:29.757 回答
0

您应该将脚本包含在头部

<link href="/common/styles/global.css" rel="stylesheet" type="text/css" />
<link href="/common/styles/lightbox.css" rel="stylesheet" type="text/css" />

<script src="/common/scripts/jquery-1.10.2.min.js"></script>
<script src="/common/scripts/lightbox-2.6.min.js"></script> 
于 2013-08-06T13:40:13.363 回答