Question

作为练习更多关于jQuery插件如何工作的练习，我想停止在javascript控制台的jQuery轮播插件中自动滚动（使用Firebug和Firefox）。

在插件here的演示中，停止自动滚动非常容易。我只是在控制台中使用以下代码。

$('#mycarousel').jcarousel('stopAuto')

然而，在this site使用旧版本的上述插件（和旧版本的jQuery）的等效代码：

$('#showcaseHolder').jcarousel('stopAuto')

不起作用。

我注意到的一个区别是，在第一个（工作）情况下，对jcarosel的调用返回'undefined'，而在第二个（不工作）情况下，它返回元素本身。

这两种情况有什么区别？如何在第二个站点上调用“stopAuto”？为什么它在第二种情况下返回元素？

感谢您的帮助!!

Answer 1

你说这是为了学习插件的工作原理..如果你在新版本中调用$('#mycaousel').jcarousel('stopAuto')，它会返回undefined，因为它不是为了链接。在旧版本中，它返回元素本身，因为插件开发人员打算在此可链接，这意味着您可以执行类似$('#mycaousel').jcarousel('stopAuto').jcarousel('startAuto')

之类的操作。在oldskool版本中

：

jCarousel函数接受'options'对象，它允许您在对象中指定可选的params，如：{scroll: 1}

如果没有阅读有关此旧版本的任何文档以及查看代码，我会假设您可以向“自动”可选参数提供“0”，这将关闭自动滚动。现在你已经自动设置为15，这意味着它应该在1.5秒后自动滚动

试试这个：

jQuery(document).ready(function() {
    jQuery('#showcaseHolder').jcarousel({
        scroll:1,
        itemLoadCallback: function (carousel, state) {
            JQUERY_CARA_LEFT = carousel;            
        },
        auto: 0, /* was auto: 15 */
        wrap:'both' 
    });
    jQuery('#showcaseHolderRight').jcarousel({
        scroll:1,
        itemLoadCallback: function (carousel, state) {
            JQUERY_CARA_RIGHT = carousel;           
        },
        auto: 0, /* was auto: 15 */
        wrap:'both' 
    }); 
});

注意：您也可以删除auto: 0，因为如果您不提供可选的'auto'参数，则默认为'0'

更新（基于评论）：

我可以告诉你答案，但我想解释一下我是如何做到的：

在jcarousel.js源代码中，这是关键部分：

// Create shortcut for internal use
var $jc = $.jcarousel;
 ...

$jc.fn.extend({
 ...
startAuto: function(s) { ... },  /* s = number of seconds to autoscroll by */
stopAuto: function() { ... }
 ...

这意味着'startAuto（s）'和'stopAuto（）'是jcarousel对象的参数。

因为在你的代码中，当你实例化jcarousel对象时，你将一个放在var JQUERY_CARA_LEFT中，而另一个放在JQUERY_CARA_RIGHT中，这是你需要使用的格式：

随时开始：

JQUERY_CARA_LEFT.jcarousel.startAuto(15);
// or
JQUERY_CARA_RIGHT.jcarousel.startAuto(15);

随时停下来：

JQUERY_CARA_LEFT.jcarousel.stopAuto();
// or
JQUERY_CARA_RIGHT.jcarousel.stopAuto();

访问jquery插件的实例

1 个答案: