Ext button 点击前后样式的修改

在这里插入图片描述
点击之前的按钮颜色
在这里插入图片描述
点击之后的颜色

Ext.create('Ext.Button', {
    text    : 'Dynamic Handler Button',
    renderTo: Ext.getBody(),
     style: {
                  backgroundColor: '#26adaf',
                  color: 'white',
                  borderRadius: '4px'
                },
                 _visited: true,
                listeners: {
                  click: function (btn) {
                    if (!btn._visited) {
                      btn._visited = true;
                       btn.getEl().setStyle({
                       backgroundColor: '#26adaf',
                       color: 'white',
                       borderRadius: '4px'
                       });
                    } else {
                      btn._visited = false;//如果注释了这里就只能改变一次,需要和上面的交换起来用
                      btn.getEl().setStyle({
                        backgroundColor: '',
                        color: '#49A9EE',
                        borderRadius: '4px',
                        borderColor: '#49A9EE'
                      });
                     /* Ext.getCmp('btn2').setStyle({
                        backgroundColor: '#26adaf',
                        color: 'white',
                        borderRadius: '4px'
                      });
                      Ext.getCmp('btn1').setStyle({
                        backgroundColor: '#26adaf',
                        color: 'white',
                        borderRadius: '4px'
                      });*/
                    }
                  }
                },
    handler : function() {
        // this button will spit out a different number every time you click it.
        // so firstly we must check if that number is already set:
        if (this.clickCount) {
            // looks like the property is already set, so lets just add 1 to that number and alert the user
            this.clickCount++;
            alert('You have clicked the button "' + this.clickCount + '" times.\n\nTry clicking it again..');
        } else {
            // if the clickCount property is not set, we will set it and alert the user
            this.clickCount = 1;
            alert('You just clicked the button for the first time!\n\nTry pressing it again..');
        }
    }
});

你可能感兴趣的:(Extjs)