widget jquery 理解

widget jquery 理解

$.widget( name, base, prototype )

widget一共有2或3个参数。base为可选。

这里之所以把base放在第二个参数里，主要是因为这样写代码更直观一些。（因为后面的prototype 是个代码非常长的大对象）。

name：

第一个参数是一个包含一个命名空间和组件名称的字符串，通过”.”来分割。
命名空间必须有，它指向widget prototype存储的全局jQuery对象。
如果命名空间没有，widget factory将会为你生成。widget name是插件函数和原型的真实名称，
比如： jQuery.widget( “demo.multi”, {…} ) 将会生成 jQuery.demo , jQuery.demo.multi , and jQuery.demo.multi.prototype .

 

base：

第二个参数（可选）是 widget prototype继承于什么对象。
例如jQuery UI有一个“mouse”的插件，它可以作为其他的插件提供的基础。
为了实现这个所有的基于mouse的插件比如draggable,
droppable可以这么做： jQuery.widget( "ui.draggable", $.ui.mouse, {...} );
如果没有这个参数，widget默认继承自“base widget” jQuery.Widget（注意jQuery.widget 和 jQuery.Widget不同） 。

 

prototype：

最后一个参数是一个对象文字，它会转化为所有widget实例的prototype。widget factory会生成属性链，连接到她继承的widget的prototype。一直到最基本的 jQuery.Widget。

一旦你调用jQuery.widget，它会在jQuery prototype ( jQuery.fn )上生成一个新的可用方法对应于widget的名字，比如我们这个例子jQuery.fn.multi。 .fn方法是包含Dom元素的jquery对象和你生成的 widget prototyp实例的接口，为每一个jQuery对象生成一个新的widget的实例。

 

作者:Chuck Lu    GitHub