jQuery 插件开发指南

内容摘要
那么首先我们来简单的看一下最正统的 jQuery 插件定义方式:
详谈JavaScript 匿名函数及闭包】这篇文章。
jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有
文章正文

那么首先我们来简单的看一下最正统的 jQuery 插件定义方式:

详谈JavaScript 匿名函数及闭包】这篇文章。

jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开发中有个很重要的作用,就是用于合并参数。

复制代码 代码如下:

$.fn.tip = function (settings) {    
var defaultSettings = {           
//颜色    
color: 'yellow',       
//延迟       
timeout: 200     }
 /* 合并默认参数和用户自定义参数 */  
settings = $.extend(defaultSettings, settings);   
alert(settings.input); <br>}

 jQuery 插件定义第二种方式:

复制代码 代码如下:

(function ($) {
    //插件定义--更换名字
    $.fn.tabpanel = function (method) {
        var methods = $.fn.tabpanel.methods;
        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
 
        }
    }
    //支持的方法
    $.fn.tabpanel.methods =
    {
        //初始化
        init: function (p_options) {
            tabpanelBind(p_options, this);
        },
        add: function (p_options) {
            addTab(p_options, this);
            tabpanelBind(p_options, this);
            // debugger
        }    }
    function add(p_options) {
        var _defaults = {
            id: ""
        }
    <br>    //内部实现略.........<br>        return _index;
    }
<br>})(jQuery);<br><br>调用  $("#team").tabpanel('add',"");

好了,上面介绍的这2种开发方式都是最常用的,小伙伴们先好好学习下吧,后续我们再介绍的更深入些


代码注释

作者:喵哥笔记

IDC笔记

学的不仅是技术,更是梦想!

© 2020 IDC笔记 . | 备案号:辽ICP备18000516号