昨天用了一下午学习Ext, 搞了一下午最后连个表格都没搞出来, 今天继续, 顺便记录一下.
中文在线手册 http://www.ajaxjs.com/docs/
这里请大家注意一下, 看手册一定要看源码包里的那个docs目录里的, Ext手册版本差异很大, 不一定最新的就一定适用。
使用Ext之前需要加载Ext库, 昨天直接加载核心, 竟然不好用, 最后看例子里面是加载了两个文件, 原因还没搞清楚, 但先记下来.
<script type=”text/javascript” src=”../ext-2.2/adapter/ext/ext-base.js”></script>
<script type=”text/javascript” src=”../ext-2.2/ext-all.js”></script>
最基础的
1
Ext.onReady(fn);
这个和Jquery的$(fn)是一样的, 就是页面加载完毕执行fn
1
Ext.get('idName');
这个就是Jquery中的$(‘#idName’), 返回一个Ext的Element对象.
Element.dom是该对象的DOM节点, 其他内容看手册里的Element部分
1
Ext.select('p')
这个类似Jquery中的$(‘p’), 但是Ext中没有each, Ext.select(‘p’).methodName()直接就作用在全部对象上.
事件绑定
1
Element.on('click', fn);
获得事件句柄
1
2
3
4
5clicked = function(e){
Ext.get(e.target).highlight();//e.target为触发该事件的对象id, highlight是高亮闪烁
}
Ext.select('p').on('click',clicked);
消息框
Ext.MessageBox为Ext的消息对象.
Ajax
ajax部分和Jquery非常相像了
1
2
3
4
5Ext.get('msg').load({
url: 'http://test/ext/data.php',
params: 'name=1',
text: 'Updating...'
});