Ext.Button

Ext.Button组件的基本用法
<div id="btn"></div>
	<script type="text/javascript">
		Ext.onReady(function() {
			Ext.QuickTips.init();
			var _btn = new Ext.Button({
				renderTo : 'btn',
				id : 'ext_button',
				text : 'Ext Button组件的基本用法',
				minWidth : 300,
				tooltip : '提示信息:Ext Button组件的基本用法',
				tooltipType : 'title',//默认为 gtip,还有 title,区别在于样式不同,gtip漂亮一点
				handler : function() {
					alert(this.text);
					//3
				},
				listeners : {
					'click' : function() {
						alert("listeners的click响应");
						//1
						//这个方法将会在handler之前运行
					}
					/*,'mouseover' : function() {
						alert("mouseover");
						//可以添加很多的事件
					}*/
				}
			});

			alert("直接使用_btn.text来获取按钮的显示的名称,_btn.text=" + _btn.text);
			//通过Button的setText方法来改变Button的显示的名称
			_btn.setText("通过Button.setText()方法来设置Button的显示的名称");
			//这个非常bt
			_btn.on('click',function(){
				//2
				alert(this.text+"使用on()方法绑定事件");
			});
		});
	</script>

获取按钮的显示的名称直接使用对象".",如:_btn.text,但是BT的是设置text的使用setText方法的。
对于Button的事件,有三种方式。
第一种:handler,这种方式默认的事件是"click"。
第二种:listeners,设置事件监听器(暂且这么理解),可以设置多个不同种类的事件。
第三种:on()方法,这种是比较好理解和复合我个人的使用习惯的一种做法。因为我写jquery比较多。
对于click事件上面的三种方法的执行顺序是, listeners最先,再是on()方法,其次是handler。

你可能感兴趣的:(JavaScript,jquery,ext)