Ajax開発を強力支援--ログ出力コンポーネント:LogReader - (page 3)

沖林正紀

2007-10-24 09:36

 リスト3では、フォームに入力されたメッセージをそのまま表示するようにしているが、LogReaderでHTMLタグがエスケープされるようになっているので、フォームに<script>と記述されても、そのまま<script>と表示されるだけで、スクリプトが実行されることはない(図3)。

リスト3 ボタンをクリックされたらログ出力(JavaScript)

// ログ出力ボタンのイベント処理を設定
YAHOO.util.Event.onContentReady( 'category', function() {
  // クリック時の処理(ログを出力)
  var clicked = function( e ) {
                  YAHOO.util.Event.stopEvent( e );
                  // ログ出力(引数はメッセージ、カテゴリの順)
                  YAHOO.log( YAHOO.util.Dom.get( 'message' ).value,
                             this.get( 'value' ) );
                };
  // ボタンの取得
  var buttons = new YAHOO.widget.ButtonGroup( 'category' ).getButtons();
  // イベント処理設定(ボタンのクリックでログを出力)
  for( var i = 0; i < buttons.length; i++ )  {
    buttons[ i ].on( 'click', clicked );
  }
});
// LogReaderを表示(draggableでドラッグ不可に設定)
YAHOO.util.Event.onContentReady( 'logger1', function() {
  this.logger1 = new YAHOO.widget.LogReader( 'logger1', { draggable : false } );
});

図3 HTMLタグはエスケープされる

 この連載も次回で最後だ。最終回は、リスト3にも記述されているイベント処理やDOMによるノードの取得といった、YUIの基本について述べたい。

ZDNET Japan 記事を毎朝メールでまとめ読み(登録無料)

ZDNET Japan クイックポール

マイナンバーカードの利用状況を教えてください

NEWSLETTERS

エンタープライズコンピューティングの最前線を配信

ZDNET Japanは、CIOとITマネージャーを対象に、ビジネス課題の解決とITを活用した新たな価値創造を支援します。
ITビジネス全般については、CNET Japanをご覧ください。

このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]