テキストフィールドに入力された文字をリアルタイムにエンティティ化する


動作ブラウザ 【 IE:4.0   NN:4.0
Internet Explorer Netscape Navigator Opera iCab Safari
3.0x 4.0x 4.5 5.0x 5.5 6.0 2.0x 3.0x 4.0x 4.x 6.0 7.0 7.x 2.x 1.x
Windows × - × × × -
Macintosh × × × - × × ×
UNIX - - - - - × × × -

ポイント result = result + "&#" + txt.charCodeAt(i) + ";"; <input type="text" size="60" name="source" onKeyUp="checkNum()">
説  明 テキストフィールドに入力された文字をリアルタイムにエンティティ化するにはテキストフィールドでonKeyupイベントで入力された文字を捕捉し変換します。文字からコードへの変換はcharCodeAt()で行なう事ができます(10進数)。
サンプル <html> <head> <title>テキストフィールドに入力された文字をリアルタイムにエンティティ化する</title> <script Language="JavaScript"><!-- function checkNum() { txt = document.cnvForm.source.value; result = ""; for (i=0; i<txt.length; i++) { result = result + "&#" + txt.charCodeAt(i) + ";"; } document.cnvForm.result.value = result; } // --></script> </head> <body> <form name="cnvForm"> 変換前:<input type="text" size="60" name="source" onKeyUp="checkNum()"><br> 変換後:<textarea cols="60" rows="5" name="result"></textarea><br> </form> </body> </html>
補足説明 なし

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA