您的位置:首页 > Web前端 > JQuery

jquery:如何开发自己的jQuery插件

2010-09-18 21:41 357 查看
1.在JQuery命名空间内声明一个特定的命名

$.fn.hilight = function() { 
    //在这里输入你的插件执行代码 
 };

我们可以这样调用:

$('#myDiv').hilight();

2.接收参数来控制插件的行为;
来为我们的hilight插件添加指定前景和背景色的功能,我们需要在函数中允许一个object类型的选项设置。如下所展示的那样:
代码

$.fn.hilight = function(options) {        
    var defaults = {        
        foreground: 'red',        
        background: 'yellow'        
      };        
        var opts = $.extend(defaults, options);                 
   };

现在,我们的插件可以这样来调用:

$('#myDiv').hilight({       
       foreground:'blue'       
    });

3.提供公有方法访问插件的配置项值;
上面的代码我们可以做一下改进,使得插件的默认值可以在插件之外被设置。这无疑是十分重要的,因为它使得插件用户可以使用最少的代码来修改插件配置,这其实是我们利用函数对象的开始。

$.fn.hilight = function(options) {        
      var opts = $.extend({}, $.fn.hilight.defaults, options);        
    };                 
   $.fn.hilight.defaults = {        
      foreground: 'red',        
      background: 'yellow'        
    };
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: