Extjs框架各组件功能及其用法.docx

Ext框架之buttonExtjs buttons 的用法：按钮基本属性Ext.QuickTips.init();??????? var buttonName = new Ext.Button({ id:buttonName,?????????????? text:Button组件基本用法,?????????????? tooltip:提示信息：Button组件基本用法,?? //提示信息,如果需要显示提示信息，需要使用Ext.QuickTips.init();?????????????????????????? tooltipType:title, //定义显示提示信息的类型，有qtip和title两种方式，默认是qtip?????????????????????????? type:button, //按钮类型：可以是submit, reset or button 　默认是 button?????????????????????????? autoShow:true,? //默认false,自动显示?????????????????????????? hidden:false,? //默认false，是否隐藏?????????????????????????? hideMode:offsets, //隐藏方式，默认display,可以取值：display，offsets，visibility?????????????????????????? cls:cssButton, //样式定义,默认?????????????????????????? disabled:false, //是否可用，默认false?????????????????????????? disabledClass:,? //默认x-item-disabled?????????????????????????? enableToggle:true, //默认false?????????????????????????? pressed:false, //设置按钮是否已经被按下，默认是false?????????????????????????? html:Ext,//默认??????????????????????????为按钮添加事件handleMouseEvents:true, //默认true,如果为false,那么mouseout　mouseover就不能被触发?????????????????????????? //x:number,y:number,在容器中的x,y坐标????????????????????????????? handler:function(){Ext.Msg.alert(提示消息框,测试Button组件：handler事件！);},//添加事件?????????????????????????? listeners:{//添加监听事件 可以结合handler测试这两个事件哪个最先执行????????????????? click:function(){?????????????????????? Ext.Msg.alert(提示消息框,测试Button组件：listeners事件！);?????????????????????? Ext.getCmp(buttonName).hide();//隐藏按钮????????????????? }????????????? },?????????????????????????? cls:x-btn-text-icon,//添加图标前需要设置该属性?????????????????????????? icon:house.gif, //图标的地址?????????????????????????? //plugins : Object/Array　扩展插件时使用?????????????????????????? repeat:false,? //默认false ,如果为true,需要设置mouseover事件?????????????????????????? renderTo:Bind_Button //将组件的显示效果渲染到某个节点的ID???????????????????? });button的配置：1. id:buttonName,2. text:Button组件基本用法,3. tooltip:提示信息：Button组件基本用法, //提示信息,如果需要显示提示信息，需要使用Ext.QuickTips.init();4. ooltipType:title, //定义显示提示信息的类型，有qtip和title两种方式，默认是qtip5. ype:button, //按钮类