https://docs.sencha.com/extjs/6.7.0/classic/Ext.button.Button.html
点击 事件
<link rel="stylesheet" href="theme-gray-all.css"><!--样式--> <script src="ext-all.js"></script> <!--行为--> <script>Ext.onReady(function () { /*-自己写的代码--开始--ExtJS 入口,相当于Java/C的main函数-*/ Ext.create('Ext.Button', { text: 'My Button', renderTo: Ext.getBody(), handler: function() {alert('click');} }); }); </script> <!--自己写的代码-----------------------结束------------------------>
同时 ,点击,移开事件
Ext.create('Ext.Button', { text: 'My Button', renderTo: Ext.getBody(), listeners: { click: { fn: function(){ alert('click'); } }, //鼠标单击事件 mouseout: { fn: function(){ alert('Mouse out'); } //鼠标移开事件 } } });
创建一个带链接的按钮
Ext.create('Ext.Button', { renderTo: Ext.getBody(), text: 'Link Button', href: 'http://www.baidu.com/' });
带下拉菜单的按钮
Ext.create('Ext.Button', { text: 'My Button', renderTo: Ext.getBody(), menu: [{ text: 'Item 1'}, { text: 'Item 2'}, { text: 'Item 3' }] });
Ext.Button has many other properties, such as bind, cls, disabled, html, tooltip, tpl, and so on, which you can use to customize the button.
Ext.create('Ext.Button', { text : 'Dynamic Handler Button', renderTo: Ext.getBody(), 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.clickCountzz) { // looks like the property is already set, so lets just add 1 to that number // and alert the user this.clickCountzz++; alert('You have clicked the button "' + this.clickCountzz + '" times.\n\nTry clicking it again..'); } else { // if the clickCount property is not set, we will set it and alert the user this.clickCountzz = 1; alert('You just clicked the button for the first time!\n\n' + 'Try pressing it again..'); } } });