更轻松地调用自定义的jQuery插件

Question

我写了一个插件与下面的“签名”：

jQuery.fn.attach = function(element, settings, duration, options, callback) { 

这里element是一个jQuery对象，settings是我的自定义设置为我的插件和duration，options和callback是我在jQuery的动画使用的所有参数，如：

someObject.animate({ someCSS }, duration, options, callback); 

现在，我的问题是：是否有可能使该功能更容易打电话？举例来说，现在，让一切工作，我希望......我必须包括所有参数和设置，我不使用null参数：

$(this).attach($('#e1-blue'), null, 3000, null, function() { alert('done'); }); 

这将是很好也能够调用此为：

$(this).attach($('#e1-blue'), 3000, function() { alert('done'); }); 

，并为这个（OFC）...

$(this).attach($('#e1-blue'), 3000); 

有什么建议？

Answer 1

我能想到的最简单的事情是重新排序参数，使得最常用的是先来。所以，如果你改变的功能：

jQuery.fn.attach = function(element, duration, callback, settings, options) { 

那么你可以做的一切（除了可能是第一个参数）将默认值代入函数体可选。如：

if(!duration) 
    duration = 3000; 

然后

$(this).attach($('#e1-blue'), 3000, function() { alert('done'); }); 

和

$(this).attach($('#e1-blue'), 3000); 

将两者是有效的，与null自动填充的其他值。

严格来说，您可以检查函数内的参数类型，例如如果第二个参数是一个整数，那么它是duration，如果它的功能是callback，如果它是一个对象，它是settings，但我不认为稍后需要关注代码的人会感谢你。它也可能使该功能难以延续到线后，例如，第二个整数参数是必需的。

Answer 2

我建议你看看方法签名来看看人们如何处理可选参数。例如，查看http://gist.github.com/277432#LID5445以查看jQuery.speed背后的设置，这是jQuery.animate使用的设置 - http://gist.github.com/277432#LID5445。

无论如何，你只是想看看你的参数的类型，看的人是否没有通过他们进来。

Answer 3

我设置一个默认对象，并接受插件功能

$.fn.myPlugin=function(opt){ 
    var o=$.extend({}, $.fn.myPlugin.defaults, opt||{}); 
    }; 
    $.fn.myPlugin.defaults={ 
    element: null, 
    settings: null, 
    options: null, 
    callback: null, 
    duration: 250 
    }; 

只有一个参数实例化插件

$('#myElement').myPlugin({element: $('#el-blue'), duration: 2000}) 

如果你每次路过的东西，你可以做的选项反对第二个参数。

$.fn.myPlugin=function(element, opt){ 
    return this.each(function(){ 
    var o=$.extend({}, $.fn.myPlugin.defaults, opt||{}); 
    //do some stuff 
    if (o.callback) { 
    o.callback.call(this, o); 
    } 
    }); 
    }; 

$('#myElement').myPlugin($('#el-blue'), {duration: 3000, callback: function(){}});