jquery 插件开发，属性，事件，方法写法？

Question

jquery 插件开发，属性，事件，方法写法？

Answer 1

jquery插件一般有三种开发方式：
通过$.extend()来扩展jQuery
通过$.fn 向jQuery添加新的方法
通过$.widget()应用jQuery UI的部件工厂方式创建
以下重点讲解第二种：
1、例如定义一个对象的写法：
var Haorooms= function(el, opt) {
this.$element = el,
this.defaults = {
'color': 'red',
'fontSize': '12px',
'textDecoration':'none'
},
this.options = $.extend({}, this.defaults, opt)
}
//定义haorooms的方法
haorooms.prototype = {
changecss: function() {
return this.$element.css({
'color': this.options.color,
'fontSize': this.options.fontSize,
'textDecoration': this.options.textDecoration
});
}
}
$.extend({}, this.defaults, opt)有{}主要是为了创建一个新对象，保留对象的默认值。

Answer 2

其实，所谓的方法，属性，事件，都是你自己总结出来的。对于纯正的JS和JQuary来说，这3个都是一种东西。我们常常用了简便写法，因此楼主才觉得这3者不同，其实这些统统都是变量。
只不过，如果变量是个参数，就是：
var temp = "怪蛋";
如果参数是个数组，那么就是：
var temp = {title:'newTab'};

而我们常见的函数，都会写成getVal(a,b,c){}其实写的更符合JS原生态的，是
var getVal = function(a,b,c){} 从这里看出，我们所谓的函数，其实和变量是一种东西。

因此所谓的$('#id').Tabs({onSelect:functuon(){}});这类情况，等于传入的是一个叫onSelect的变量，而这个变量刚好是一个函数类型而已。事实上这个onSelect原本并不存在，是你后来的插件里去调用了而已。你通过英文意思觉得这是“被选中”的意思，其实在这里，仅仅是一个名字而已。只有插件内部写到$(this).on("click",function(){});才真正调取到JS原本的event的click事件。而我们插件中常见的onSelect、onClick、onSuccess都是写插件的人按照自己的喜好和大家喜欢的名字而命名的。