Question

$(".fancybox-effects-b").fancybox({
    openEffect  : 'none',
    closeEffect : 'none',
    closeClick : true,
    helpers : {
    title : {
        type : 'inside'
        }
    }
});

这是一个花式框的代码我包含整个lib文件夹和花式框的源文件夹，但我仍然在Uncaught TypeError: undefined is not a function得到$(".fancybox-effects-b").fancybox可能是什么原因导致此

UPDATE

获得代码here

这是我使用的所有脚本

    <link   type="text/css" rel="stylesheet" href="css/style.css">
    <script type="text/javascript"src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="http://oap.accuweather.com/launch.js"></script>

<!-- Add fancyBox main JS and CSS files -->
    <!-- Add jQuery library -->
    <script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>

    <!-- Add mousewheel plugin (this is optional) -->
    <script type="text/javascript" src="lib/jquery.mousewheel-3.0.6.pack.js"></script>

    <!-- Add fancyBox main JS and CSS files -->
    <script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
    <link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />

    <!-- Add Button helper (this is optional) -->
    <link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
    <script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>

    <!-- Add Thumbnail helper (this is optional) -->
    <link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
    <script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

    <!-- Add Media helper (this is optional) -->
    <script type="text/javascript" src="source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<!-- Add fancyBox main JS and CSS files --> 
<script type="text/javascript" src="js/js.js"></script>

<!--slider-->
    <script type="text/javascript" src="js/jssor.core.js"></script>
    <script type="text/javascript" src="js/jssor.utils.js"></script>
    <script type="text/javascript" src="js/jssor.slider.js"></script>
<!--slider end-->

Answer 1

尝试

jQuery发布了$，并且有两个jQuery lib加载!!!

 <script type="text/javascript"src="js/jquery-1.11.1.min.js"></script>

 <script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>

从标题中删除其中一个。

编辑你的脚本必须这样才能工作：

jQuery(document).ready(function($) {
    $(".fancybox-effects-b").fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        closeClick : true,
        helpers : {
        title : {
            type : 'inside'
        }
    }
});

}）;

Answer 2

您已包含2个jQuery脚本。删除其中一个

<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript"src="js/jquery-1.11.1.min.js"></script> //remove anyone of them

键入浏览器的控制台jQuery并检查它是否给出了功能。

或者在onload或ready函数（）

中调用脚本

jQuery(document).ready(function($) {
    $(".fancybox-effects-b").fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        closeClick : true,
        helpers : {
        title : {
            type : 'inside'
        }
    }
});

这里$或jQuery变量将被视为jQuery对象。任何人，而不是一次两个

因此一次使用一个而不是使用两个。

jQuery(document).ready(function($) {
    jQuery(".fancybox-effects-b").fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        closeClick : true,
        helpers : {
        title : {
            type : 'inside'
        }
    }
});

Answer 3

你的jQuery参考不起作用，这使得fancybox不起作用。

修复jQuery引用，一切都应该没问题

未捕获的TypeError：undefined不是花式框的功能

3 个答案: