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(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する。

Answer 3

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

    ...

    return { makeSlider: makeSlider };
}

Answer 4

現在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);