javascript - 如何在函数中执行函数

Question

我有这个看起来像这样的 jQuery 插件：

(function($){  

$.fn.s3Slider = function(vars) {       

    // (...)
    timeOutFn = setTimeout(makeSlider, thisTimeOut);
    // (...)

    var makeSlider = function() {

        // next Image

    }

    makeSlider();

};  

})(jQuery);

我可以开始

jQuery(document).ready(function() { 
   jQuery('#s3slider').s3Slider({
       timeOut: 4000
   });
});

现在我的问题是，如何从外部执行 makeSlider() 函数？这是一个图像滑块，我想添加一个下一个按钮功能。

我想要这样的东西，但这是错误的

jQuery.s3Slider.makeSlider();

Answer 1

您可以返回一个包含对要公开的函数的引用的对象：

(function($){  

    $.fn.s3Slider = function(vars) {       

        ...

        function next(){
           // Advance the slide here
        }

        // Return only the functions that you want to expose
        return {
          next: next
        };
    }

};  

})(jQuery);

然后你可以像这样使用它：

var s3Slider = jQuery('#s3slider').s3Slider({
    timeOut: 4000
});

s3Slider.next();

Answer 2

$.fn.s3Slider = function(...) {

    ...

    return { makeSlider: makeSlider };
}

Answer 3

目前makeSlider只存在于s3Slider函数范围内。

为什么不制作makeSlider它自己的插件，然后让s3Slider（和你）调用它？

(function($){
    $.fn.makeSlider = function(){
        // Next image
    };

    $.fn.s3Slider = function(vars){
        // Your code
        var that = this;
        setTimeout(function(){
            $(that).makeSlider();
        }, thisTimeOut);
    };
})(jQuery);

Answer 4

你可以实现你想要的，但它有点复杂。

改变

$.fn.s3Slider = function(vars) {       
    // (...)
    timeOutFn = setTimeout(makeSlider, thisTimeOut);
    // (...)
    var makeSlider = function() {
        // next Image
    }
    makeSlider();
};

至

$.fn.s3Slider = (function(){
    var makeSlider;
    var f = function(vars) {       
        // (...)
        timeOutFn = setTimeout(makeSlider, thisTimeOut);
        // (...)
        makeSlider = function() {
            // next Image
        }
        makeSlider();
    }; 
    f.makeSlider = makeSlider;
    return f;
})();

之后，您都可以将该s3Slider功能用作

$(someElement).s3Slider()

做

$.fn.s3Slider.makeSlider();

或者

$(someElement).s3Slider.makeSlider();

makeSlider从外部访问。