Question

我正在尝试在ext js中创建面板并获得成功，但我还想用这个添加click事件

       {
            xtype: 'panel',
            flex: 1,
            x: 10,
            y: parseInt(panelCreation[i - 1].y) + 
               parseInt(panelCreation[i -1].height) + 10,
            width: twidth,
            height: theight,
            layout: 'absolute'                
        }

我不想单独添加点击事件我想用布局后添加这个代码：绝对添加逗号和事件请帮助我。

Answer 1

您可以为点击事件添加以下内容：

listeners: {
   'render': function(panel) {
       panel.body.on('click', function() {
           alert('onclick');
       });
    }
}

编辑：要获取click事件的X和Y坐标，您可以按如下方式更改click事件处理程序...

panel.body.on('click', function(e) {
   alert('X: ' + e.getPageX());
   alert('Y: ' + e.getPageY());
});

Answer 2

new Ext.Panel({
    title: 'The Clickable Panel',
    listeners: {
        render: function(p) {
            // Append the Panel to the click handler's argument list.
            p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true));
        },
        single: true  // Remove the listener after first invocation
    }
});

Answer 3

在我看来，还有一种更为直接的方法......（直接从docs开始）。有关添加侦听器的详细信息，请参阅here。（Ext Js 4）

new Ext.panel.Panel({
    width: 400,
    height: 200,
    dockedItems: [{
        xtype: 'toolbar'
    }],
    listeners: {
        click: {
            element: 'el', //bind to the underlying el property on the panel
            fn: function(){ console.log('click el'); }
        },
        dblclick: {
            element: 'body', //bind to the underlying body property on the panel
            fn: function(){ console.log('dblclick body'); }
        }
    }
});

使用ExtJS Panel添加Click事件

3 个答案: