当前位置:首页 > 开发 > Web前端 > Jquery > 正文

jQuery插件开发

发表于: 2013-10-18   作者:songchuanlu   来源:转载   浏览次数:
摘要: 1、类级别的插件开发类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法。典型的例子就是$.ajax()这个函数,将函数定义于jQuery的命名空间中。关于类级别的插件开发可以采用如下几种形式进行扩展:1.1 添加一个新的全局函数定义格式:   jQuery.pluginName = function() { alert('测试'); }

1、类级别的插件开发

类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法。
典型的例子就是$.ajax()这个函数,将函数定义于jQuery的命名空间中。
关于类级别的插件开发可以采用如下几种形式进行扩展:

1.1 添加一个新的全局函数

定义格式:

 

jQuery.pluginName = function() {
    alert('测试');  
};

 

实例代码:

 

(function($) {
    $.formatDate = function(date, mask){
        // TODO 格式化日期对象
    };
})(jQuery);

 

1.2 增加多个全局函数

 

定义格式:

 

jQuery.pluginName1 = function() {   
    alert('测试1');
};  
jQuery.pluginName2 = function() {   
    alert('测试2');
};

 

实例代码:

 

(function($) {
    $.formatDateObj = function(dateObj, mask){
        // TODO 格式化日期对象,返回格式化后日期字符串
    };
    $.parseDateStr = function(dateStr, mask){
        // TODO 解析日期字符串,返回日期对象
    };
})(jQuery);

 

1.3 使用jQuery.extend(object);

 

定义格式:

 

jQuery.extend({      
    pluginName1 : function() {      
        alert('测试1');      
    },      
    pluginName2 : function(param) {      
        alert('测试2, 参数是:' + param);      
    }     
});

 

实例代码:

 

(function($) {
    $.extend({      
        formatDateObj: function(dateObj, mask) {      
            // TODO 格式化日期对象,返回格式化后日期字符串
        },      
        parseDateStr: function(dateStr, mask) {      
            // TODO 解析日期字符串,返回日期对象
        }     
    });
})(jQuery);

 

1.4 使用命名空间

 

定义格式:

 

jQuery.chuanlu = {
    pluginName1 : function() {
        alert('测试1');
    },
    pluginName2 : function(param) {
        alert('测试2, 参数是:' + param);
    }
};

 

采用命名空间的函数仍然是全局函数,调用时采用的方法:

$.chuanlu.pluginName1();

$.chuanlu.pluginName2('hello world');

 

实例代码:

 

(function($){
    $.chuanlu = {
        formatDateObj: function(dateObj, mask) {
            // TODO 格式化日期对象,返回格式化后日期字符串
        },
        parseDateStr: function(dateStr, mask) {
            // TODO 解析日期字符串,返回日期对象
        }
    }
})(jQuery);

 

 

2、对象级别的插件开发

 

对象级别的插件开发有如下的两种定义格式:

 

格式一

 

(function($) {
    $.fn.pluginName = function(options) {
         // TODO 插件实现代码
    };
})(jQuery);

 

格式二

 

(function($){
    $.fn.extend({
        pluginName:function(options){
            // TODO 插件实现代码
        }
    });
})(jQuery);

jQuery插件开发

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
jQuery插件库 jQuery插件 jQuery插件库 精品代码 WEB技术 常用插件: 1、抽奖转*盘插件(附件) jQu
jQuery插件库 jQuery插件 jQuery插件库 精品代码 WEB技术 常用插件: 1、抽奖转*盘插件(附件) jQu
要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生
原文: JQuery插件开发教程 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发
要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生
jQuery插件开发精品教程,让你的jQuery提升一个台阶 要说jQuery 最成功的地方,我认为是它的可扩展
jQuery插件开发模式 软件开发过程中是需要一定的设计模式来指导开发的,有了模式,我们就能更好地组
插件的概念大家并不陌生了,插件可以很方便我们进行代码开发,大大节约了我们的开发时间。以前我用j
原帖地址:http://www.cnblogs.com/egojit/archive/2013/06/05/3118680.html 合肥程序员群:49313181
合肥程序员群:49313181。 合肥实名程序员群:128131462 (不愿透露姓名和信息者勿加入) Q Q:4083653
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号