JavaScriptのTIPS、技術的ポイント、有用なライブラリなどを紹介していきます。

更新: 06/03/24 | JavaScript編 | JavaScript

JavaScriptとは

JavaScriptはJavaから派生したスクリプト言語です。
Javaと似たところも多いのですが、用途や詳細はかなり異なります。
まず、Javaなどのようなライブラリを意識した細かなコーディングは不要で、インタプリタと呼ばれる逐次実行型の言語であるためとっつきやすいというメリットがあります。
用途としてはご存じの通り、ブラウザ自体にエンジンが実装されてHTMLに埋め込まれたJavaScriptを実行させるという形態が大部分を占めます。

TIPS

ページ間で変数の内容を引き渡す

通常、<form></form>タグを使ってフォームを作成した場合、Action="*"で指定されたURL(*の部分)に変数と値が送信されます。
そして、送信先はJSP、ASP、CGIなどのサーバーサイドプログラムに引き渡されるのが通例となっています。
これを、普通のHTMLファイルに引き渡しJavaScriptに解釈させることにより、サーバーサイドテクノロジーを利用せずにインタラクティブなサイトを構築することが出来ます。(但し、DBを利用した恒久的なデータ収集などは出来ませんが)

エンコードとデコード

ここで問題となるのが、変数に日本語が指定されている場合などにブラウザが勝手にエンコーディングを行う問題です。
特にIE4以降ではUnicodeでデコード、NetscapeではASCIIエンコードと言った具合に日本語(ダブルバイト)をシングルバイトに変換するエンコードアルゴリズムが異なるという点と、値を引き渡されたHTML(の中のJavaScript)ではこれをデコードする簡単な方法がない点が頭痛の種となります。

解決方法

http://nurucom-archives.hp.infoseek.co.jp/digital/escape-codec-library.html

にあるJavaScript関数群は、前述のエンコードデコードの問題を解決してくれる数少ないユーザー関数です。
一般的には、サーバーサイドプログラムには関数一発でデコードできる方法が用意されているのですが、JavaScriptにはunescapeという関数しか見あたらず、unescapeではShift-JISがエンコードされた値を正常にデコードできないという問題があるのです。

そこで、直ぐに思いつく解決方法はフォームからSubmitする際に全ての日本語が混入する可能性のあるタグ(INPUTとTEXTAREA)の値をescape関数で明示的にエンコードする方法です。これで、値を受け取ったJavaScriptはunescape関数で正常にデコードできるはずです。
しかし、これではSubmit時に値をescape関数でエンコードしながら文字列結合する必要などが生じ変更に弱いサイトになってしまいます。勿論これは、編集する人間の編集負担が増すということでもあります=面倒くさいということです。

これを、同関数のUnescapeSJIS関数などを使えば一発で解決します。
NetscapeもIE4以降でも同じコードでOKです。大変便利ですね。

渡された値の取り出し方

ページ間で渡された値はアンパサンドで区切られていますし、チェックボックスなどは少し特殊な形で値が引き渡されます。

指定した変数の値を取り出す

インターネットでビジネスにある活用方法に少し書いてありますが、こちらも既存の関数を使わせていただきましょう。

オブジェクトなJSの基礎講座から getHikisuu 関数を拝借して利用できます。便利な関数に感謝ですね。

また、この際エンコードされた値はgetHikisuu関数のunescape関数では正常にデコードできませんので、UnescapeSJISに置き換えることを忘れないようにしましょう。

チェックボックスの状態を受け取る

チェックボックスの値は、チェックされている変数にはヌル=''が渡されます。
逆にチェックされていない変数は引き渡されないため、getHikisuu関数で取り出そうとするとUndefinedが返されます。
この特徴を利用して、条件分岐させれば当該のチェックボックスがチェックされているかどうか確認することが出来ます。

if(getHikisuu.data.test == '') {
  document.write('checked');
}

こんな感じで、簡単に判断できます。



 ◆ ◆ ◆


自己紹介 新しい更新 リンク 相互リンク集 ダウンロード 掲示板 婦人体温計
カウビ バイク ローバーミニ 音楽 アフィリエイト 自転車 ゲーム
ワイン 通販日記 神楽坂 DIY ラーメン DOS/V MacBook
キャプチャ LavieJ Printer 開発TIPS ShurikenPRO 万能リモコン X68000
Copyright (c)1998-2006
Fujigoma Project Presents.
 CNXGROUP All Rights Reserved.