日期:2014-05-16  浏览次数:20335 次

ExtJS:我这样绑定事件为什么不可以呢?
<html>
<head>
<link rel="stylesheet" type="text/css" href="./ExtJS4/resources/css/ext-all.css" />
<script type="text/javascript" src="./ExtJS4/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
    var panel=new Ext.Panel({
     renderTo:'panel',
     frame:true,
     width:80,
     height:80,
     title:'Radio',
     items:[{
         id:'radio1',
         xtype:'radio',
     boxLabel:'选项一',
     name:'radio',
     inputValue:'1',
     checked:true
     }]
    });
    Ext.getCmp('radio1').on('focus',function(this,The,eOpts){   //这行会报错,说是this不认识
     console.log("radio1");
    });
});
</script>
</head>
<body>
<div id="panel"></div>
</body>
</html>

但是focus事件的API是这样写的
focus( this, The, eOpts )
Fires when this Component receives focus.

Available since: 4.1.0

Parameters
this : Ext.Component
The : Ext.EventObject
focus event.
eOpts : Object
The options object passed to Ext.util.Observable.addListener.

也就是说那个this指代当前被点击的组件吧?那我写上this来指代当前被点击的组件为什么告诉我不认识呢,我写成下面的形式就不报错了,也就是放入一个现成的组件
    Ext.getCmp('radio1').on('focus',function(panel,The,eOpts){
     console.log("radio1");
    });

这是为什么呢
------解决方案--------------------
    Ext.onReady(function () {
        Ext.create('Ext.Button', {
            text: 'Click me',
            renderTo: Ext.getBody(),
            id: 'btn'
        });
        //按钮点击事件的参数  click( this, e, eOpts )
        Ext.getCmp('btn').on('click', function (btn/*不能用this作为参数名称*/, e, eOpts) {
            alert(btn.getText());
            //或者
            alert(this.getText()); //事件中的this对象总是指向绑定事件的那个按钮对象
            alert(this==btn)//true
        });
    });