爱米*阅

不是日志,不是剪切板

JQ UI Development 1

发布时间   2011-02-15 @ 20:23:00 标签    编辑 | 分享 0

版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://www.blogbus.com/amixyue-logs/105392203.html

I’ve decided to blog in English or somewhat so called Chinglish .

While surfing the Internet for information of JQuery UI, I came across bililite who had been working as a full-time pediatrician and spending his spare time as a computer hacker . Quite an amazing guy !

Just now I have a discussion with Menzhu and Sajia talking about QML which is used as nokia Qt framework .QML is javascript-based , declarative language for designing user interface centric applications . Sajia, who is mad for parser, suggests developing a QML-like language . Frankly , I have no idea about this .

Menzhu suggest digging JSF and Facelet for ideas . I called back to the area when programmers using languages like Java and C speak out ‘using framework to help frontend development ’ , which is called liberation .

I have been focusing on Java swing for long and then find that writing more javascript with mature javascript framework may inspire me more . Javascript is not java , so I can’t reluctantly apply Java’s OOP to javascript and should make most of javascript .

In jQury UI ,there’s

$.fn.plugin = function(){} 

this can add plugin to jQuery , thus strongify components . But by this way, I can just do event handling . That means how can I remove a plugin from an element .

Considering plugin as a function module added to the jQuery element which in turn opperate the corresponding element help a lot .But there is a circle from jQ element to func module and from func module to jQ element which affects the garbage collector’s job.

jQuery ‘s

$(el).data(key:{target:el}

give us a way to avoid circular references and therefore be safe from memery leaks .

So consult to widget for help .

$.widget(‘ui.my_widget’, my_widget);
my_widget = {
       _create : // once the instance is created
       _init : //once the instance is re-inited
       distroy : //once the instance is distroyed
       sth : // sth defined by user
       };

the variable within my_widget :

 this //the func module itself
 this.element //the element to which the instance is bond
 this.options //for each instance to bind variable

the higher level is callbacks :

tightly bind :

 $(el).my_widget({change:function(){}});
 if(this.options.change) var callback =  this.options.change

loosely bind :

$(el).bind // bind handler to event
this.element.trigger // excute all handles for the jq element
this._trigger(type,event,data) // the type _trigger creates a custom event name of
                                  widgetName+type, like green6change

the more is for mouse :

ui.core.js offers mouse processing .

分享到: