Ajaxを使おう
掲載日: 2005年 06月 28日
Ajax 動的なテーブル書き換え

動的なテーブル書き換え
今回のサンプルで'sansu.txt'などに利用した、JavaScriptのencodeURI()メソッドで手軽にエンコードできるページを用意しました。これでエンコードしてサーバーへ置き、受信時にdecodeURL()すれば、MacのSafariやLinuxのkonquerrorでも文字化けせずにAjaxを利用できます。
とりあえず、ここでは、エンコードされたデータから更に、JSONの配列とオブジェクトで利用される [、]、{、}のエンコードを除外し、軽量化のため、タブと改行と空白を除去しました(ソースは単純ですので、利用する環境などにあわせて、自分用にカスタマイズして使うのも良いかもしれません)。
-
まず、上のテキストエリアへもとデータを入力してから下のボタンを押してください。
ちなみに、前ページサンプルのデータは、次のようにエンコードしてあります。
エンコード前
[ [ '名前' , '国語' ] , [ '山田' , '12' ] , [ '田中' , '28' ] , [ '中山' , '56' ] , [ '山本' , '98' ] , [ '本井' , '12' ] , [ '井上' , '18' ] , [ '上山' , '48' ] ]
エンコード後
[['%E5%90%8D%E5%89%8D','%E5%9B%BD%E8%AA%9E'],['%E5%B1%B1%E7%94%B0','12'],['%E7%94%B0%E4%B8%AD','28'],['%E4%B8%AD%E5%B1%B1','56'],['%E5%B1%B1%E6%9C%AC','98'],['%E6%9C%AC%E4%BA%95','12'],['%E4%BA%95%E4%B8%8A','18'],['%E4%B8%8A%E5%B1%B1','48']]
これにkokugo.txtなどの名前をつけて、文字コードは、UTF-8で保存してください。前ページサンプルでは、それを、次の関数setDataで呼び出して処理しています。
<a href="javascript:void(0)"
onmouseover="setData('kokugo.txt')">国語</a>

