EXTイベント
標準htmlでのイベント処理
<script> function a() { alert('some thing'); }</script><input id="btnAlert" type="button" onclick="a();" value="alert " />
バインド方法
<script>function a(){alert('some thing');}window.onload=function(){document.getElementById("btnAlert").onclick=a;}</script><input id="btnAlert" type="button" value="alert " />
=====================================================================EXTバインドイベント
<script>function a(){alert('some thing');}Ext.onReady(function(){ Ext.get("btnAlert").addListener("click",a); });</script><input id="btnAlert" type="button" value="alert " />
EXTバインド複数イベント
Ext.onReady(function(){ Ext.get("btnAlert").on("click",a);Ext.get("btnAlert").on("click",a); });
EXTイベント遅延処理
Ext.onReady(function(){ Ext.get("btnAlert").on("click",a,this,{delay:2000}); });
addListenerを呼び出すと指定したdelayが2000に渡されるため、ユーザがボタンをクリックすると、イベント応答関数はすぐに実行されず、2000ミリ秒、すなわち2秒後にプロンプトメッセージボックスがポップアップされる.
イベントポップアップ
<html>
<head><title>Getting Started Example</title>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" language="javascript">
var i=0;
function newWin()
{
var win=new Ext.Window({title:" "+i++,
width:400,
height:300,
maximizable:true});
win.show();
}
Ext.onReady(function(){
Ext.get("btn").on("click",newWin);
});
</script>
</head>
<body>
<div id="hello"></div>
<input id="btn" type="button" name="add" value=" " />
</body>
</html>ETXシリーズ：
EXTベース
EXTテーブル
EXTイベント