2008年2月5日火曜日

ExtJs-2(OnReadyは多重で書いても関係ない)

イベントハンドラのサンプルを試す。
きになったのでOnReadyを分割してみる。
問題ない。

※使用したいメソッドをのレンダリング情報生成の際、
OnReadyの開始と終了を把握して作成しなくてもよいということ。

 //--- ライブラリ定義 ---

<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<script type="text/javascript" src="./ext-2.0.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext-2.0.1/ext-all-debug.js"></script>
<link rel="stylesheet" type="text/css" href="./ext-2.0.1/resources/css/ext-all.css" />

<script type="text/javascript"><!--
Ext.onReady(
function(){
//--- チュートリアル ---
var myDiv = Ext.get('myDiv');
myDiv.highlight(); // 要素の背景が黄色にハイライトされ、もとの色に戻っていきます
myDiv.addClass('red'); // カスタムCSSクラスを追加します(ExtStart.cssで定義してある)
myDiv.center(); // 要素をセンタリングします
myDiv.setOpacity(.25); // 要素を部分透過にします

//--- チュートリアル2(select) ---
Ext.select('p').highlight();

//--- ボタンイベントハンドラ定義 ---
Ext.get('myButton').on('click',
function()
{
alert("You clicked the button");
}
);
}//function
);//OnReaady

//--- onReadyの分割テスト ---
Ext.onReady(
function(){
//--- pタグのイベントハンドラ ---
Ext.select('p').on('click',
function()
{
alert("You clicked a paragraph");
}
);
}//function
);//OnReaady
//--></script>

0 件のコメント: