点击之前的按钮颜色
点击之后的颜色
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..');
}
}
});