xv4*_*v47 2 javascript jquery colorbox
我已经检查了 jQuery 是否已加载,colorbox 脚本是否已加载并且它们都已正确加载(我使用 .getScript 来查看是否正确加载了 colorbox 并且我得到了肯定的结果)。但是,该函数不会加载 colorbox,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>
Run Code Online (Sandbox Code Playgroud)
我已经检查了几次以确保脚本位于正确的目录中。链接在这里:
<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>
Run Code Online (Sandbox Code Playgroud)
您需要在 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>
Run Code Online (Sandbox Code Playgroud)
顺便说一下,大多数 jquery 插件就是这种情况。
我在 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);
Run Code Online (Sandbox Code Playgroud)
所以我的 ColorBox 调用如下所示:
(function ($) {
$('#myelement').click(function (e) {
e.preventDefault();
var url = $(this).attr('href');
$.colorbox({ href: url, width: 936, height: 582, top: 160});
});
})(jQuery);
Run Code Online (Sandbox Code Playgroud)