如何在函數執行功能

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啓動（）函數從外面？ 這是一個圖像滑塊，我想添加一個Next Button功能。

我想是這樣的，但它是錯的

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。