如何在选项卡面板中为 ExtJS 选项卡添加点击事件答案

【问题标题】：How to add click event for ExtJS tab in tabpanel如何在选项卡面板中为 ExtJS 选项卡添加点击事件
【发布时间】：2017-09-06 14:59:36
【问题描述】：

我有标签面板，默认情况下所有标签都处于禁用状态。根据条件，一些选项卡将被启用，我已经完成了那部分。现在我想为选项卡添加点击事件，我尝试使用 tabchange 但问题是当我在运行时启用选项卡时触发 tabchange 事件但我希望在用户单击选项卡时触发它。

var empTabPanel= new Ext.tab.Panel({
        id: 'emptabpanel',
        width: '100%',
        xtype: 'container',
        layout: 'hbox',
        items: [{
                title: 'Personal Details',
                border: 0,
                id: 'PERSONAL_DETAILS'
            },{
                title: 'Department Details',
                border: 0,
                id: 'DEP_DETAILS'
            },{
                title: 'Leave Details',
                border: 0,
                id: 'LEAVE_DETAILS'
            }]
    });

【问题讨论】：

尝试在运行时使用suspendEvent函数。当您的操作完成时使用 resumeEvent 函数。
感谢 D.V 成功了 :)

标签： extjs extjs5

【解决方案1】：

我已经在评论中写了，但大多数人没有看到评论，这就是我在帖子中写这篇文章的原因。

尝试在运行时使用 suspendEvent 功能。当您的操作完成时使用 resumeEvent 功能。

如何使用上面的功能？

tabPanel.suspendEvent ( eventName ) 
tabPanel.resumeEvent ( eventName )

--> 别忘了resumeEvent

谢谢..:)

【讨论】：

【解决方案2】：

你可以添加一个默认监听器

    var empTabPanel= new Ext.tab.Panel({
          ...
    	    defaults: {
              handler: function(item){
                ...
                if(item is tab1){
                   // active/inactive
                }
                else if(){}...
              }
            },
            items: [{
                    title: 'Personal Details',
                    border: 0,
                    id: 'PERSONAL_DETAILS'
                },{
                    title: 'Department Details',
                    border: 0,
                    id: 'DEP_DETAILS'
                },{
                    title: 'Leave Details',
                    border: 0,
                    id: 'LEAVE_DETAILS'
                }]
                
           });

【讨论】：