已加载 JQuery 和 Colorbox，但“colorbox 不是函数”答案

【问题标题】：JQuery and Colorbox loaded but "colorbox is not a function"已加载 JQuery 和 Colorbox，但“colorbox 不是函数”
【发布时间】：2013-12-29 19:02:57
【问题描述】：

我检查了是否同时加载了 jQuery 和颜色框脚本，并且它们都已正确加载（我使用 .getScript 来查看颜色框是否正确加载并且我得到了肯定的结果）。但是该函数不会加载颜色框，并且 Firebug 说“$(...).colorbox 不是函数”。该代码曾经可以工作，但我不确定我做了什么来破坏它。这是标题：

<!DOCTYPE html>
<head>
<link rel="stylesheet" href="colorbox.css"/>
<script src="Scripts/jquery.colorbox.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="Scripts/scripts.js"></script>
<script>

$(document).ready(function(){
    $(".popup").colorbox({transition: "elastic", opacity: 0.5, speed: 350});
    var panels = $('.accordionButton > .accordionContent').hide();
    $("div.accordionButton").click(function(){
        panels.slideUp();           
        $(this).parent().next().slideDown();
        return false
    });

});
</script>
</head>

我已经检查了几次以确保脚本位于正确的目录中。这是链接：

<div id='supermenu'><table><tr><td><a href='login.php?lang=en' class='popup'>Login</a></td><td> or </td><td><a href='register.php?lang=en'> Register </a></tr></td></table></div>

【问题讨论】：

标签： javascript jquery colorbox

【解决方案1】：

您需要在jquery 文件之后引用colorbox 文件。像这样：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="Scripts/jquery.colorbox.js"></script>
<script src="Scripts/scripts.js"></script>

顺便说一下，大多数 jquery 插件都是这种情况。

【讨论】：

谢谢你这样做。我以前用过彩盒，我一直在挠头，试图弄清楚我在其中做对了什么，在这里做错了什么。

【解决方案2】：

我在 Chrome 浏览器中出现了同样的错误。

如果上述解决方案没有帮助，#MannyFleurmond 解决方案对我的情况有所帮助。尝试使用 function($) 扭曲 colorbox js 调用：

 (function($) {
   // Inside of this function, $() will work as an alias for jQuery()
   // and other libraries also using $ will not be accessible under this shortcut
 })(jQuery);

所以我的 ColorBox 调用如下所示：

 (function ($) {
        $('#myelement').click(function (e) {
            e.preventDefault();
            var url = $(this).attr('href');
            $.colorbox({ href: url, width: 936, height: 582, top: 160});

        });
    })(jQuery);

【讨论】：

e.colorbox is not a function 是我使用您的解决方案时得到的结果
您的 jquery.colorbox.js 是否在正确的路径中？
谢谢伙计。我为此苦苦挣扎了一整天。晚上好，我看到了你的。它给了我一个很好的解决方案。