ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

简记 jQuery 插件模板

2019-08-30 11:51:25  阅读:187  来源: 互联网

标签:jQuery function 插件 name plugin 简记 var data options


 1 /**
 2  * @lisence jquery plugin demo v1.0.0
 3  *
 4  * author: Jeremy Yu
 5  *
 6  * description: 
 7  *   this is a jquery plugin Template
 8  *   see the end of this document to learn how to use the jquery plugin
 9  */
10 ;
11 (function($, window, document, undefined) {
12 
13     /* 插件类定义 */
14     var PluginName = function(el, options) {
15         this.version = "1.0.0"
16         this.el = el;
17         this.options = options;
18         this.init(); //调用初始化方法
19     }
20 
21     /* 定义无参方法,方法名为 init */
22     PluginName.prototype.init = function() {
23         /*  初始化操作 */
24         alert('初始化成功');
25     }
26 
27     /* 定义有参方法,方法名为 func */
28     PluginName.prototype.func = function(arg) {
29         /* TODO  */
30     }
31 
32     /* 定义有返回值方法,方法名为 funcRet */
33     PluginName.prototype.funcRet = function() {
34         /* TODO 
35          * 执行完后返回结果
36          * 返回值可以是undefined、null、数字、字符串、布尔值、对象等
37          * 如果没有返回,默认返回 undefined
38          */
39         return 0;
40     }
41 
42     /* 定义命名空间,且作为data的key */
43     var namespace = 'plugin_name';
44     /* 定义插件 */
45     $.fn.plugin_name = function(options) {
46         var $this = $(this);
47         var value, args = Array.prototype.slice.call(arguments, 1);
48         var data = $this.data(namespace);
49         if (!data) {
50             var settings = $.extend({}, $.fn.plugin_name.defaults, options);
51             $this.data(namespace, data = new PluginName(this, settings));
52         }
53         if (typeof options == 'string') {
54             value = data[options].apply(data, args);
55         }
56         return typeof value === 'undefined' ? this : value;
57     };
58 
59     /* 定义插件的默认值(属性、事件) */
60     $.fn.plugin_name.defaults = {
61         prop1: "",
62         prop2: "",
63         onEvent: function(arg1, arg2) {},
64         one rror: function(err) {}
65     };
66 
67 
68     /*
69         引入 jquery.min.js 和 当前 js 文件
70 
71         HTML代码:
72         <div id="#plugin"></div>
73 
74         插件使用
75         $('#plugin').plugin_name({ prop1 : '', onEvent : function(){}});
76 
77         方法调用
78         $('#plugin').plugin_name('function_name', args);
79     */
80 
81 })(jQuery, window, document);

 

标签:jQuery,function,插件,name,plugin,简记,var,data,options
来源: https://www.cnblogs.com/silfox/p/11434206.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有