二、Ext.Button组件

Ext.Button组件替代传统submit、reset、button控件

构造参数:

  -text:按钮上的名称

属性:

  -text:获取当前按钮上的名称

  -minWidth:按钮的最小宽度

方法:

  -setText:设置按钮名称

事件:

  -click:点击

一、按钮定义、属性获取及属性设置

    <script type="text/javascript">
            Ext.onReady(function(){
            var button=new Ext.Button({
                renderTo:document.body,//将当前对象所生成的HTML对象存放到指定的对象中
                text:"确定",//按钮上的名称
                minWidth:100
            });
            alert(button.text);//获取按钮属性
            button.setText("取消");//setText设置按钮名称
        });
    </script>

二、click事件触发

1.使用handler

  <script type="text/javascript">
        Ext.onReady(function(){
            var button=new Ext.Button({
                renderTo:document.body,
                text:"确定",
                minWidth:100,
                handler:function(){//handler指定一个函数句柄,在默认事件触发时调用,此时默认事件是click
                    alert("你好");
                }
            });
        });
    </script>

 

 2.使用listeners定义事件

  <script type="text/javascript">
        Ext.onReady(function(){
            var button=new Ext.Button({
                renderTo:document.body,                text:"确定",
                minWidth:100,
                listeners:{//listeners在对象初始化之前,就将一系列时间进行定义
                    "click":function(){//click函数
                        alert("你好");
                    }
                }
            });
        });
    </script>

 

3.on

  <script type="text/javascript">
        Ext.onReady(function(){
            var button=new Ext.Button({
                renderTo:document.body,                text:"确定",
                minWidth:100
            });
            button.on("click" , function(){
                alert("欢迎你学习EXTJS") ;
          }) ;
        });

 

posted @ 2015-07-02 00:05  W&L  阅读(193)  评论(0)    收藏  举报