YAHOO YUI工具库(二)

繁简对译:[]  字体设置:[] 2009-10-15  作者:来自网络  来源:来自网络  阅读  次

4. YUI提供的Event工具集
YUI提供的Event工具集简化了浏览器中事件驱动程序的编写,提供了一种简单的接口来定制事件和检查浏览器中的event对象。YUI事件工具集提供了自定义事件对象(Custom Event),通过自定义事件对象可以“发布”自己感兴趣的时刻或事件,页面中的YUI组件能够响应这些自定义的事件并做出回应。

YUI对事件响应的顺序:通过YUI Event工具集添加的事件,默认是在冒泡过程中执行事件处理函数的。从DOM节点上来说,是从子节点向根节点响应事件。



Event需要的引入
<!-- Dependency -->

build/yahoo/yahoo-min.js

<!-- Event source file -->

build/event/event-min.js



Event和Custom Event分别定义在YAHOO.util.Event和YAHOO.util.CustomEvent中

Event工具集提供的方法
YAHOO.util.Event.addListener(element,eventType,fn,obj,override)

参数:

element:为绑定事件的元素id,可以是一个数组,以支持批量操作

eventType:为事件类型

fn:为事件响应的回调函数

obj:当override为true时,为回调函数传入的参数对象;当override为false时,该参数被忽略。

override:

返回值类型:Boolean

功能:给指定的element绑定事件响应函数





YAHOO.util.Event.removeListener:function(element,eventType,fn)

参数:

element:为绑定事件的元素id,

eventType:事件类型

fn:为事件响应函数

返回值类型:Boolean

功能:给指定的element解除绑定事件



YAHOO.util.Event.purgeElement ( el , recurse , sType )

参数:

el:为绑定事件的元素id,

recurse:Boolean值,是否解除子节点的事件绑定

sType:事件类型

返回值类型:Boolean

功能:给指定的element解除绑定的同一类型的事件,也可以解除子节点上绑定的这一类型的事件



YAHOO.util.on

addListener的函数别名



YAHOO.util.Event.onAvailable( p_id , p_fn , p_obj , p_override )

参数:

p_id:为绑定事件的元素id,

p_fn:为事件响应函数

p_obj:同addListener的obj参数

p_override:同addListener的override参数

返回值类型:无

功能:当指定的element的p_id出现时,执行事件响应函数。如果在页面初始化之前执行这一函数,当页面加载时(可能还未完成时),就会执行响应的事件响应函数;如果放在页面加载之后执行这一函数,将以固定的时间轮询,当element可用时响应这一事件。这个轮询的的时间是可以配置的,缺省的时间是10秒一次。



YAHOO.util.Event.onContentReady( p_id , p_fn , p_obj , p_override )

参数:

p_id:为绑定事件的元素id,

p_fn:为事件响应函数

p_obj:同addListener的obj参数

p_override:同addListener的override参数

返回值类型:无

功能:与onAvailable类似,但不同的是事件响应函数是等到element可以安全的修改的时候才响应。



YAHOO.util.Event.onDOMReady ( p_fn , p_obj , p_scope )

参数:

p_fn:为事件响应函数

p_obj:同addListener的obj参数

p_scope:同addListener的override参数

返回值类型:无

功能:当DOM第一次可用时执行响应函数。



YAHOO.util.Event.preventDefault ( event)

参数:

event:事件对象

返回值类型:无

功能:阻止事件的缺省行为发生。



YAHOO.util.Event.getListeners ( el , sType )

参数:

el:HTML element

sType:事件类型,String类型

返回值类型:Object{

type:事件类型

fn:addListener添加的事件响应函数

obj:提供给事件响应函数的参数对象

adjust:否获取缺省的事件监听器

index:UI事件监听器列表中的位置

}

功能:阻止事件的缺省行为发生。



YAHOO.util.Event.getTime( event)

参数:

event:事件对象

返回值类型:Date对象

功能:获取事件发生时的时间。



YAHOO.util.Event.getTarget(ev , resolveTextNode)

参数:

evt:事件对象

resolveTextNode:

返回值类型: HTML element

功能:获取事件发生时的页面标签。对于IE即window.event.srcElement





5. YUI提供的CSS样式
5.1. Fonts
字体的规范样式,需要引入build/fonts/fonts-min.css

5.2. Reset
规范了所有HTML element的缺省样式,需要引入build/fonts/reset-min.css

5.3. Grids
提供了用于页面排版的CSS样式,需要引入build/fonts/grids-min.css

打印 收藏 关闭