技术开发 频道

10条建议让你创建更好的jQuery插件

  11.更新:制作你的全局默认设置

  某些插件你可能想要制作你自己的全局默认设置,以使得开发者能够定义他们自己的默认设置。通过下面的代码,这很容易实现:

(function($)
{
    $.fn.wTooltip
= function(option, settings)
    {
        settings
= $.extend({}, $.fn.wTooltip.defaultSettings, settings || {});

        
// plugin code
    };

    $.fn.wTooltip.defaultSettings
= {
        position    :
'mouse',
        color       :
'black'
    };

    
//Prototype/classes here
})(jQuery);

  现在,开发者可以使用 类似下面的代码来设置他们想要设置的一切默认值:

$.fn.wTooltip.defaultSettings.color = 'white';

$(
"#container").wTooltip(); // call pluign normally

  这给予了你的插件一个你想要提供的、很好的、额外的灵活性。使用者也可以想象使用一种既使用全局设置又使用私有的设置的混合型方案,这种方案需要你在那个设置的地方再继承一次设置,当然,这是一种很罕见的、特殊的使用方式。

  12.更新:制作一个设置的局部副本Update: Make a Local Copy of Settings

  如果你发现你的插件需要对设置进行大量的改变,也许为每个插件实例的设置保持一套局部的副本是非常重要的。例如,如果我们使用这样的一个能应用在多个元素上的插件,这个插件使用一个变量来保存每个循环元素的标题设置,那么最终这个变量保存的是最后一个循环元素的标题设置。然后,如果我们想要访问前一个元素的标题设置时,这个变量却返回了我们最后设置的标题变量值,而不是我们期望的前一个元素的标题变量值。

(function($)
{
    $.fn.wTooltip
= function(option, settings)
    {
        settings
= $.extend({}, $.fn.wTooltip.defaultSettings, settings || {});

        
return this.each(function()
        {
            
var $settings = jQuery.extend(true, {}, settings);

            
//code
        }
    };

    
//Prototype/classes/defaults here
})(jQuery);

  上面的代码应该包含了大部分你要开发的 jQuery 插件的核心代码,可作为 以后开发插件的一个很好的模板。有一套基础的代码可以大幅节省你的开发时间,并给了你一个默认的方法来构建你的插件,自信地知道如何处理 各种你可能遇到的问题。

0
相关文章