javascript使用jCarousel时抛出运行时错误

时间:2014-01-28 01:52:42

标签: jquery jquery-plugins jcarousel

我正在尝试使用jCarousel,当页面加载时会抛出此错误..

JavaScript runtime error: Object doesn't support property or method 'jcarousel' 

我得到了这个功能......

(function($) {
$(function() {
    $('[data-jcarousel]').each(function() {
        var el = $(this);
        el.jcarousel(el.data());
    });

    $('[data-jcarousel-control]').each(function() {
        var el = $(this);
        el.jcarouselControl(el.data());
    });
});
})(jQuery);

,错误在第五行。

这是我的标记...

<div class="wrapper">
        <div class="jcarousel-wrapper">
            <div data-jcarousel="true" data-wrap="circular" class="jcarousel">
                <ul>
                    <li><img src="images/1.png" width="600" height="400" alt=""></li>
                    <li><img src="images/2.png" width="600" height="400" alt=""></li>
                    <li><img src="images/3.png" width="600" height="400" alt=""></li>
                    <li><img src="images/4.png" width="600" height="400" alt=""></li>
                </ul>
            </div>
            <a data-jcarousel-control="true" data-target="-=1" href="#" class="jcarousel-control-prev">&lsaquo;</a>
            <a data-jcarousel-control="true" data-target="+=1" href="#" class="jcarousel-control-next">&rsaquo;</a>
        </div>
    </div>

这是我标题中的脚本......

<meta charset="utf-8" />
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<link rel="stylesheet" href="http://localhost:3108/code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">

<script src="jquery-1.10.2.min.js"></script>
<script src="jcarousel.data-attributes.js"></script>

我试过将函数本身放在header标签中,但仍然会抛出错误。我已经在这方面寻找答案,没有具体的内容。

由于

1 个答案:

答案 0 :(得分:0)

我当然不是jCarousel的专家,但我没看到你actually include it的哪个位置?

我看到一些看起来像插件的东西:

<script src="jcarousel.data-attributes.js"></script>

但我希望在此之前看到实际的jCarousel脚本:

<script type="text/javascript" src="jquery.jcarousel.js"></script>

<强>更新

我的意思是,为了完成这项工作,您需要的完整脚本列表是:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.jcarousel.js"></script>
<script type="text/javascript" src="jcarousel.data-attributes.js"></script>

你需要包含jQuery,你已经做过了。 你还需要包含jCarousel,你目前没有。你只需要在数据属性插件之前包含它,以使一切正常。