`
wj.king
  • 浏览: 69122 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

[转载]EXT核心API详解(七)-KeyNav/KeyMap/JSON/Format/..

阅读更多
Ext.KeyNav
Ext的keyNav类能为Ext.Element元素提供简单的按键处理方法
例:
var el=Ext.get("textarea");
new Ext.KeyNav(el, {
    "left" : function(e){
        alert("left key down");
        },
    scope : el
    }
);
它的行为与KeyMap类似,但功能比KeyMap要弱小的多,只能处理以下已定义键
enter/left/right/up/down/tab/esc/pageUp/pageDown/del/home/end
同情一下KeyNav

方法只有三个,不用多解释
KeyNav( Mixed el, Object config )
disable() : void
enable() : void

Ext.KeyMap类
则强悍的多,其中最重要的当然是对按键的定义更灵活
例:上例用KeyMap来写可能是
var el=Ext.get("textarea");
new Ext.KeyMap(el, {
        key:Ext.EventObject.LEFT,
        fn: function(e){
            alert("left key down");
        },
        scope : el
    }
);

方法
KeyMap( Mixed el, Object config, [String eventName] )
构造,与KeyNav也相似,但更灵活
它是{
key:        String/Array,     //可以是数字,字符,也可以是Ext.EventObject.LEFT这样的助记符,还能是他们组成的数组
shift:       Boolean,          //ctrl键按下?
ctrl:        Boolean,
alt :        Boolean,
fn :        Function,         //回叫方法
scope:       Object          //范围
}这样的对象或它们组成的数组
比如{key: 10},{key: [10,13]},{key:'\t'},{key:'abcd'},{key:Ext.EventObject.LEFT}都是合法的定义

addBinding( Object/Array config ) : void
增加新的绑定动作 config参见构造

disable() : void
enable() : void
isEnabled() : Boolean
允许,静止和状态查询

on( Number/Array/Object key, Function fn, [Object scope] ) : void
只添加一个处理时addBinding的快捷方式,但个人感觉并没有简单到哪儿去。


Ext.util.JSON
轮到大名鼎鼎的JSON了,可惜Ext提供的JSON对象功能好弱小,只有encode主decode两个方法
而且只能编码String/Array/Date,至少也要搞个 xml2json/json2xml方法呀

Ext.util.Format
主要提供了一些格式化方法

capitalize( String value ) : String
首字母大写

date( Mixed value, [String format] ) : String
格式化日期输出,还是Date.format方法好用

dateRenderer( String format ) : Function
返回一个利用指定format格式化日期的方法

defaultValue( Mixed value, String defaultValue ) : String
如果value未定义或为空字符串则返回defaultValue

ellipsis( String value, Number length ) : String
如果value的长度超过length的,取前length-3个并用...替代,对中国人来说还是垃圾功能,用的字符串长度不是字节长度

fileSize( Number/String size ) : String
简单的格式化文件长度为 xxxbytes xxxKB xxxMB,没有GB哟

htmlEncode( String value ) : String
htmlDecode( String value ) : String
HTML编码解码,将& < > “替换为&amp;&lt;&gt;&quot;

lowercase( String value ) : String
将value转换为全小写

stripScripts( Mixed value ) : String
去除脚本标签

stripTags( Mixed value ) : String
去除HTML标签

substr( String value, Number start, Number length ) : String
取子字符串

trim( String value ) : String
去除开头和结尾的空格

undef( Mixed value ) : Mixed
如果value未定义,返回空字符串,反之返回value本身

uppercase( String value ) : String
转为全大写

usMoney( Number/String value ) : String
转为美元表示

Ext.util.DelayedTask
提供一个setTimeout的简单替代方法

公开的方法也只有三个
DelayedTask( [Function fn], [Object scope], [Array args] )
delay( Number delay, [Function newFn], [Object newScope], [Array newArgs] ) :
cancel() : void
简单的示例用法如果
var task=new Ext.util.DelayedTask(Ext.emptuFn);
task.delay(1000);
task.cancel();

Ext.util.TaskRunner
增强版的DelayedTask,能提供多线程的定时服务,
例:
var task = {
    run: function(){
        Ext.fly('clock').update(new Date().format('g:i:s A'));
    },
    interval: 1000
}
var runner = new Ext.util.TaskRunner();
runner.start(task);

四个方法都很简单
TaskRunner( [Number interval] )
start( [Object task] ) : Object
stop( Object task ) : Object
stopAll() : void


Ext.util.TextMetrics
这个类主要是为了准备的得到块状化文本正确的高度和宽度
例:
var metrics=Ext.util.TextMetrics.createInstance('div');
metrics.setFixedWidth(100);
var size=metrics.getSize("中华人民共和国中华人民共和国中华人民共和国中华人民共和国");
Ext.MessageBox.alert("getsize",String.format("width:{0}px\theight:{1}px",size.width,size.height))

方法
bind( String/HTMLElement el ) : void
绑定到el

createInstance( String/HTMLElement el, [Number fixedWidth] ) : Ext.util.TextMetrics.Instance
为el创建TextMetrics实例

getHeight( String text ) : Number
getSize( String text ) : Object
getWidth( String text ) : Number
得到尺寸

measure( String/HTMLElement el, String text, [Number fixedWidth] ) : Object
测算文本text在el中将要占用的尺寸

setFixedWidth( Number width ) : void
设置指定的宽度

Ext.XTemplate
增强型模板,支持更多功能了,虽然方法不多,但用起来来还真的很麻烦,但并不建议大家学习这样的自定义语法,不如用xslt
另外这个Xtemplate虽然命名空间在Ext之下,但源文件却是放在util目录中的
XTemplate( String/Array html )
XTemplate.from( String/HTMLElement el ) : Ext.XTemplate
apply() : void
applyTemplate( Object values ) : String
compile() : Function
这些方法Ext.Template中都有说明
分享到:
评论

相关推荐

    EXT核心API详解

    EXT核心API详解 1、Ext类 ………………………………… 2 2、Array类 …………………………… 4 3、Number类 …………………………… 4 4、String类 …………………………… 4 5、Date类 ……………………………… 5 ...

    Ext Js权威指南(.zip.001

    8.1.3 格式化输出数据:ext.string、ext.number、ext.date和ext.util.format / 389 8.1.4 超级模板:ext.xtemplate(包括ext.xtemplateparser和ext.xtemplatecompiler) / 393 8.1.5 模板的方法 / 396 8.2 组件...

    zh-cn.js中文化

    zh-cn.js中文化

    ExtJS入门教程(超级详细)

    17、Ext.KeyMap类 …………………… 19 18、Ext.util.JSON类 ……………………… 20 19、Ext.util.Format类 ………………… 20 20、Ext.util.DelayedTask类 ……………… 20 21、Ext.util.TaskRunner类 …………… ...

    Ext深入浅出 数据传输

    11.8 Ext.util.Format............................. 290 11.9 使用Ext.util.CSS管理CSS样式..... 290 11.10 使用Ext.util.ClickRepeater 处理点击事件...................................... 291 11.11 使用Ext....

    ExtJSWeb应用程序开发指南(第2版)

    6.13 Ext.KeyNav为元素提供简单的按键处理方法 6.13.1 实例化一个键盘绑定对象 6.13.2 废弃原有键盘绑定 6.13.3 将废弃的键盘绑定重新生效 6.14 Ext.KeyMap提供更灵活强大的对按键的处理方法 6.14.1 构造函数 ...

    keynavish:在Windows上使用键盘控制鼠标

    关键点 在Windows上,用键盘控制鼠标。 这是Windows的的重写。 它与原始版本(模)完全兼容... ~/.config/keynav/keynavrc 如果设置,则路径中的波浪号( ~ )会扩展为%HOME%的值,并回退为%USERPROFILE% (通常为C

    keynav:一个 Thunderbird 插件,允许通过键入部分或全部文件夹名称来快速导航文件夹树

    #快速文件夹键导航(keynav) ##描述 这是 Thunderbird 的附加组件,当文件夹树具有焦点时,它允许通过键入部分或全部文件夹名称来快速导航文件夹树。 ##获取附加组件 获得快速文件夹键导航的最简单方法是从 ...

    jquery.dropdown:可定制的风格化下拉菜单

    jquery.dropdown-jQuery插件 基本用法: 在页面中包含JS和CSS,并调用dropdown jQuery方法来格式化select输入。 $ ( 'select' ) .... keyNav : true // navigate through list items using the keyboard ar

    corebird:本机Gtk + Twitter客户端

    酷鸟 ...捷径 钥匙 描述 Ctrl + t 撰写推文 Back 向后翻一页(可以通过键盘上的“后退”...当一条推文被关注时(通过keynav): r回复 tt转推 f最爱 q报价 dd删除 Return -显示推文详细信息 翻译 翻译是通过的处理的

Global site tag (gtag.js) - Google Analytics