ExtJS 学习日记<1>
1、一般都要加载三个文件 ext-all.css ext-all.js ext-base.js2、一般情况下每一个用户的ExtJS 都是从Ext.onReady();开始3、组件的使用 new Ext.Window();就可以创建一个窗口 new Ext.GridPanel()就可以创建一个表格 var panel = new Ext.Panel({title:"hello",width:300,height:200,html:"Hell,easyif open source"}); panel.render("hello"); //render方法后面的参数表示页面上的div元素id,也可以直接在参数中通过renderTo参数来省略用render 方法，只需要在构造函数的参数中添加一个renderTo属性即可New Ext.Panel({renderTo:"hello",width:300,height:200,html:"Hello,easyif open source"});4、addListener 方法代码中，第一个参数表示时间名称，第二个参数表示事件处理器或整个响应函数 <script type="text/javascript"> function a(){ alert('some thing'); } Ext.onReady(function(){ Ext.get(btnAlert).addListener("click",a); }); </script><input id="btnAlert" type="button" value="aler框" />5、一个事件添加多个响应函数 <script type="text/javascript"> function a(){ alert('some thing'); } Ext.onReady(function(){ Ext.get("btnAlert").on("click",a); Ext.get("btnalert").on("click",a); }); </script><input id="btnAlert" type="button" value="aler框" />6、ExtJS还支持事件延迟处理或时间缓存 <script type="text/javascript"> function a(){ alert('some thing'); } Ext.onReady(function(){ Ext.get("btnAlert").on("click",a,this,{delay:2000}); }); </script><input id="btnAlert" type="button" value="aler框" />7、一个页面中只能有一个ViewPort实例 <script type="text/javascript"> Ext.onReady(function(){ new Ext.Viewport({ enableTabScroll:true, layout:"fit", items:[{title:"面板", html:"", bbar:[{text:"按纽1"}, {text:"按纽2"}] }] }); }); </script>8、Viewport常用的border布局 <script type="text/javascript"> Ext.onReady(function(){ new Ext.Viewport({ enableTabScroll:true, layout:"border", items:[{title:"面板", region:"north", height:50, html:"网站后台管理系统"}, {title:"菜单", region:"west", width:200, collapsible:true, html:"菜单栏"}, {xtype:"tabpanel", region:"center", items:[{title:"面板1"},{title:"面板2"}] } ] }); }); </script> (来源：http://www.iomo.cn)
页:
[1]