Class/Extras
优质
小牛编辑
129浏览
2023-12-01
Class: Chain
一个工具类,能链式执行函数,及一个函数完成后触发另一个函数,它的方法能被另一个类通过Class:implement继承,当前它被Fx和Request继承.例如在Fx类里,它能用来创建复杂的自定义动画.
Chain Method: constructor
语法:
新类
var MyClass = new Class({ Implements: Chain });
已存在的类
MyClass.implement(Chain);
独立类
var myChain = new Chain;
例如:
var Todo = new Class({ Implements: Chain, initialize: function(){ this.chain.apply(this, arguments); } }); var myTodoList = new Todo( function(){ alert('get groceries'); }, function(){ alert('go workout'); }, function(){ alert('code mootools documentation until eyes close involuntarily'); }, function(){ alert('sleep'); } );
Chain Method: chain
向Chain结尾追加函数。
语法:
myClass.chain(fn[, fn2[, fn3[, ...]]]);
参数:
- fn - (function or array)函数(或函数数组)追加到调用链接尾。
返回:
- (object)当前类的实例。
例如:
//Fx.Tween has already implemented the Chain class because of inheritance of the Fx class. var myFx = new Fx.Tween('myElement', {property: 'opacity'}); myFx.start(1,0).chain( //Notice that "this" refers to the calling object (in this case, the myFx object). function(){ this.start(0,1); }, function(){ this.start(1,0); }, function(){ this.start(0,1); } ); //Will fade the Element out and in twice.
Chain Method: callChain
移除第一个,并执行它,第二个将变成第一个.
语法:
myClass.callChain([any arguments]);
参数:
- 传递参数到当前要执行的函数。
返回:
- (mixed)返回当前执行函数的返回值,如果链条为空,没有执行函数则反回false。
例如:
var myChain = new Chain(); myChain.chain( function(){ alert('do dishes'); }, function(){ alert('put away clean dishes'); } ); myChain.callChain(); // alerts 'do dishes'. myChain.callChain(); // alerts 'put away clean dishes'
Chain Method: clearChain
清空一个Chain.
语法:
myClass.clearChain();
返回:
- (object)当前实例。
例如:
var myFx = Fx.Tween('myElement', 'color'); // Fx.Tween inherited Fx's implementation of Chain. myFx.chain(function(){ while(true) alert("D'oh!"); }); // chains an infinite loop of alerts. myFx.clearChain(); // cancels the infinite loop of alerts before allowing it to begin.
Class: Events
一个工具类,这个类能被其它类通过Class:implement继承,例如,在Fx类里,'complete','start','cancel'事件,
继承Events的类必须增加一个选项或一个addEvent函数,而不是直接通过.options.onEventName增加.
语法:
对于一个新类
var MyClass = new Class({ Implements: Events });
对开已存在的类
MyClass.implement(Events);
Implementing
- 这个类能被继承到其它类。
- Events被设计与Option类一块工作,当option属性以'on'开始然后一个大写字母,将被作为事件添加.(如'onComplete'将作为'complete'事件)
例如:
var Widget = new Class({ Implements: Events, initialize: function(element){ // ... }, complete: function(){ this.fireEvent('complete'); } }); var myWidget = new Widget(); myWidget.addEvent('complete', myFunction);
注意事项:
- 以'on'开始的事件支持所有的方法,并且将转化成没有'on'的(例如'onComplete'转化成'complete') 。
Events Method: addEvent
添加一个事件。
语法:
myClass.addEvent(type, fn[, internal]);
参数:
- type - (string)事件的类型(例如'complete') 。
- fn - (function)事件函数。
- internal - (boolean, optional)设置函数属性:internal为true。internal属性通常用来防止删除。
返回:
- (object)这个类的实例。
例如:
var myFx = new Fx.Tween('element', 'opacity'); myFx.addEvent('start', myStartFunction);
Events Method: addEvents
和addEvent相似,但接受一个对象可以一次添加多个事件。
语法:
myClass.addEvents(events);
参数:
- events - (object)一个key:value对象,key事件名称(如"start" ) ,和值,当事件发生时要调用的函数。
返回:
- (object)这个类的实例。
例如:
var myFx = new Fx.Tween('element', 'opacity'); myFx.addEvents({ start: myStartFunction, complete: function() { alert('Done.'); } });
Events Method: fireEvent
触发事件.
语法:
myClass.fireEvent(type[, args[, delay]]);
参数:
- type - (string)事件的类型(例如'complete') 。
- args - (mixed,optional)传递给函数的参数。要传递多个参数,该参数必须是一个数组。
- delay - ( number,optional)等待时间,单位毫秒。
返回:
- (object)这个类的实例。
例如:
var Widget = new Class({ Implements: Events, initialize: function(arg1, arg2){ //... this.fireEvent('initialize', [arg1, arg2], 50); } });
Events Method: removeEvent
删除一个事件。
语法:
myClass.removeEvent(type, fn);
参数:
- type - (string)事件的类型(例如'complete') 。
- fn - (function)要删除的函数。
返回:
- (object)这个类的实例。
注意事项:
如果函数具有internal属性,并设置为true,则该事件将不会被删除。
Events Method: removeEvents
删除多个事件,如果没有指定,则删除所有的.
语法:
myClass.removeEvents([events]);
参数:
- events - (optional)如果没有指定则删除所有事件。
- (string)事件名(例如'success')
- (object)一个key:function对像,同addEvents中的参数那样.
返回:
- (object)当前类的实例。
例如:
var myFx = new Fx.Tween('myElement', 'opacity'); myFx.removeEvents('complete');
Class: Options
一个工具类,能被另一个类通过Class:implement继承.通常自动设置一个类的option,也增加一个事件当属性以'on'+大写字母(例如'onComplete'增加一个'complete'事件).你需要用this.setOptions()设置option.
语法:
对于新类
var MyClass = new Class({Implements: Options});
对于已存在的类:
MyClass.implement(Options);
Options Method: setOptions
合并默认选项.每个传入的值将被深度拷贝.如果不想深度拷贝请使用其它方法.
语法:
myClass.setOptions([options]);
参数:
- options - (object, optional)用户定义的选项与默认值合并。
返回:
- (object)当前类的实例。
例如:
var Widget = new Class({ Implements: Options, options: { color: '#fff', size: { width: 100, height: 100 } }, initialize: function(options){ this.setOptions(options); } }); var myWidget = new Widget({ color: '#f00', size: { width: 200 } }); //myWidget.options is now: {color: #f00, size: {width: 200, height: 100}} // Deep copy example var mySize = { width: 50, height: 50 }; var myWidget = new Widget({ size: mySize }); (mySize == myWidget.options.size) // false! mySize was copied in the setOptions call.
Options in combination with Events
如果一个类继承了Events和Option,每个'on'+大写字母(如'onStart')将是一个事件,假设选项值为function.
例如:
var Widget = new Class({ Implements: [Options, Events], options: { color: '#fff', size: { width: 100, height: 100 } }, initialize: function(options){ this.setOptions(options); }, show: function(){ // Do some cool stuff this.fireEvent('show'); } }); var myWidget = new Widget({ color: '#f00', size: { width: 200 }, onShow: function(){ alert('Lets show it!'); } }); myWidget.show(); // fires the event and alerts 'Lets show it!'