1、联动菜单

1. var provinces = [ [ 1, '北京' ], [ 2, '上海' ] ]; 
2. var cities = new Array(); 
3. cities[1] = [ [ 11, '海淀' ], [ 22, '东城' ] ]; 
4. cities[2] = [ [ 33, '黄埔' ], [ 44, '浦东' ], [ 55, '静安' ] ]; 
5.  
6. var comboProvinces = new Ext.form.ComboBox({ 
7.  
8.     store : new Ext.data.SimpleStore({ 
9.         fields : [ "provinceId", "provinceName" ], 
10.         data : provinces 
11.     }), 
12.  
13.     listeners : { 
14.         select : function(combo, record, index) { 
15.             comboCities.clearValue(); 
16.             comboCities.store.loadData(cities[record.data.provinceId]); 
17.         } 
18.     }, 
19.  
20.     valueField : "provinceId", 
21.     displayField : "provinceName", 
22.     mode : 'local', 
23.     forceSelection : true, 
24.     blankText : '请选择省份', 
25.     emptyText : '请选择省份', 
26.     hiddenName : 'provinceId', 
27.     editable : false, 
28.     triggerAction : 'all', 
29.     allowBlank : true, 
30.     fieldLabel : '请选择省份', 
31.     name : 'provinceId', 
32.     width : 80 
33.  
34. }); 
35.  
36. var comboCities = new Ext.form.ComboBox({ 
37.     store : new Ext.data.SimpleStore({ 
38.         fields : [ "cityId", 'cityName' ], 
39.         data : [] 
40.     }), 
41.  
42.     valueField : "cityId", 
43.     displayField : "cityName", 
44.     mode : 'local', 
45.     forceSelection : true, 
46.     blankText : '选择地区', 
47.     emptyText : '选择地区', 
48.     hiddenName : 'cityId', 
49.     editable : false, 
50.     triggerAction : 'all', 
51.     allowBlank : true, 
52.     fieldLabel : '选择地区', 
53.     name : 'cityId', 
54.     width : 80 
55. }); 
56.  
57. new Ext.Window({ 
58.     width : 300, 
59.     height : 200, 
60.     layout : 'column', 
61.     items : [ comboProvinces, comboCities ] 
62. }).show(); 

2、让window最小化：重写minimize方法

1. var window = new Ext.Window({ 
2.         width : 400, 
3.         height : 300, 
4.         title : 'my window', 
5.         minimizable :true, 
6.         minimize : function() { 
7.             window.hide(); 
8.         }, 
9.         maximizable : true 
10.     }); 
11.     window.show(); 

3、灵活的javascript

1. function Animal(name) { 
2.     this.name = name; 
3.     this.age = 0; 
4. }; 
5.  
6. alert(Animal); //赋值功能。输出函数本身
7. alert(Animal());//执行函数。undefined，执行函数但无返回值
8. alert(new Animal());//object 
9. alert(new Animal);//object 

4、javascript的可变参数：定义时不需要指定输入参数个数

1. function sum() { 
2.     var s = 0; 
3.     for(var i = 0; i < arguments.length ; i++){ 
4.         s += arguments[i]; 
5.     } 
6.     return s; 
7. }; 
8.  
9. alert(sum(1,2)); 
10. alert(sum(1,2,3,4,5,6)); 

5、combo默认选中一个，且前台展示和后台传值存在mapping关系

1. render : function(combo) {   
2.                         combo.setValue("0");   //设置默认选中第一个值   
3.                     }   

1. data : [ ['all', '0'],['ip', '1'], ['cookie', '2']] 

默认前台会选中all 

6、combo从远程记载数据

1. var mystore = new Ext.data.ArrayStore({  
2.     fields : [ 'myId', 'displayText' ],  
3.     //data : [ [ 1, 'ALL' ], [ 2, 'IP' ], [ 3, 'COOKIE' ] ] 
4.     proxy: new Ext.data.HttpProxy({url: '../../blackList/searchCookieTypes.do'}),    
5. });  
6. var top = new Ext.FormPanel({  
7.     width : 600,  
8.     height : 400,  
9.     title : 'hello',  
10.     labelWidth: 50,  
11.     labelAlign:'right',  
12.     bodyStyle : 'padding:5px 5px 10 10',  
13.     frame : true,  
14.     defaults : {  
15.         xtype : 'combo',  
16.         width : 120,  
17.         height : 20,  
18.         typeAhead: true,  
19.         triggerAction: 'all',  
20.         lazyRender:true,  
21.         mode: 'remote',  
22.         valueField: 'myId',  
23.         displayField: 'displayText'  
24.     },  
25.     items : [ {  
26.         fieldLabel : 'lable1',  
27.         store : mystore  
28.     }  
29.     , {  
30.         fieldLabel : 'lable2',  
31.         store : mystore  
32.     }],  
33.     buttons : [ {  
34.         text : 'save'  
35.     }, {  
36.         text : 'cancel'  
37.     } ]  
38. });  
39.  
40. top.render(document.body);  

7、gridpanle的展示与数据传递分开

返回：回调ColumnModel的 renderer  方法

1. header : "处罚方式", 
2. dataIndex : 'punishMode', 
3. //水印:0、断链:1、错误码(拦截):2 
4. renderer : function(punishNumber) { 
5.     if(punishNumber == 0){ 
6.         return "水印"; 
7.     } 
8.     if(punishNumber == 1){ 
9.         return "断链"; 
10.     } 
11.     if(punishNumber == 2){ 
12.         return "错误码"; 
13.     } 
14.     return ""; 
15. } 

下发数据：只能java代码处理，无法做映射回去

8、switch语句

1. var submitObject = form.getValues(); 
2.                         submitObject.appId = appId; 
3.                         switch(submitObject.punishMode){ 
4.                             case 'waterMark':submitObject.punishMode='0';break; 
5.                             case 'disconnect':submitObject.punishMode='1';break; 
6.                             case 'errorCode':submitObject.punishMode='2';break; 
7.                             default:submitObject.punishMode=""; 
8.                         } 

9、html中的靠左显示和靠右显示

<span style='float:left'>居左</span><span style='float:right'>居右</span>

<div style="float:left;">靠左显示</div>

<div style="float:right;">靠右显示</div> 

10、js中的续行 

js的行符是“\”
document.write("dsdddddd\
dffdsg\
gdfsgfd\
gfdgfdgdf";
是合法代码

11、顶部用户名显示：header_panel.body.update(topMenu);

1. var header_panel = new Ext.Panel( 
2.                     { 
3.                         // frame : false, 
4.                         // border : false, 
5.                         autoScroll : false, 
6.                         height : 60, 
7.                         region : 'north', 
8.                         bodyStyle : 'background-color:#D5E2F2', 
9.                         listeners : { 
10.                             afterrender : function(thiz) { 
11.                                 Ext.Ajax.request({ 
12.                                             url : '../../user/getUserName.do', 
13.                                             success : function(response, opts) { 
14.                                                 var responseText = Ext.decode(response.responseText); 
15.                                                 if (responseText.success) { 
16.                                                     username = responseText.data[0]; 
17.                                                 } else { 
18.                                                     username = "customer"; 
19.                                                 } 
20.                                                 var topMenu = '<p><img alt="" src="logo.png"><a href="main.html">首页</a>&nbsp;\ 
21.                                                     用户:'+ username + ' &nbsp;&nbsp;<a href="../others/others.html">退出系统</a></p>'; 
22.                                                 header_panel.body.update(topMenu); 
23.                                             } 
24.                                         }); 
25.                             } 
26.                         }/*, 
27.                         html : '<p><img alt="" src="logo.png"><a href="main.html">首页</a>&nbsp;\ 
28.                         用户:Admin'+ username + ' &nbsp;&nbsp;<a href="../others/others.html">退出系统</a></p>'*/ 
29.                     }); 

本文转自 tianya23 51CTO博客，原文链接：http://blog.51cto.com/tianya23/847209，如需转载请自行联系原作者