
■ 状況
javaScriptでSELECT要素の値に応じて、ある項目の表示/非表示を切り替える処理があったのですが、IEのバージョンが10以上(実際の発生は11)の時に、これまで正常に動作していた処理が異常するようになりました
HTMLはこんな感じにします。
<%-- 形態 --%>
<SELECT name="form" tabindex="-1" onClick="JavaScript:formChange();">
<OPTION value="01">01</OPTION>
<OPTION value="03">03</OPTION>
</SELECT>
<LABEL id="wearhouseLabel" style="">01の時のみ表示する</LABEL>
そして、javaScriptはこうです。
<%-- ヘッダ部の書式設定処理 --%>
function formChange() {
try {
<%-- 形態 = "01" の場合 --%>
if (document.getElementById("form").value == '01') {
document.getElementById("wearhouseLabel").style.display = "none";
<%-- 形態 = "03" の場合 --%>
} else {
document.getElementById("wearhouseLabel").style.display = "";
}
<%-- エラー発生時の処理 --%>
} catch(e) {
window.alert("【エラー検出】¥n¥n 発生処理 = formChange¥n¥n error = " + e.description + "¥n¥n error # =" + e.number);
return;
}
}
SELECTの値が変更されたら、formChangeを実行。formChangeでは、SELECTの値によってLABEL(wearhouseLabel)の表示/非表示を切り替えています。エラー内容が捉えられるように、エラートラップも仕掛けておきます。
これで画面を表示すると、「未定義またはNULL参照のプロパティ'value'は取得できません」(-2146823281)というエラーが発生します。

IE8までは問題ないようなのだが・・・
■ 対応
SELECT要素のname属性と同じ名称でid属性を追加しました。
<%-- 形態 --%>
<SELECT id="form" name="form" tabindex="-1" onClick="JavaScript:formChange();">
<OPTION value="01">01</OPTION>
<OPTION value="03">03</OPTION>
</SELECT>
<LABEL id="wearhouseLabel" style="">01の時のみ表示する</LABEL>
■ 後書き
HTML5の関係で発生するようになったエラーだとは思うのですが、SELECT要素のname属性って廃止されてないと思ってたんですけどね。まぁ、理屈はともかく動かないを話にならないので直したのですが。
勤め先では、元々はホストコンピュータを使用していて、クライアント側にはエミュレーターをインストールするタイプ(要はC/S)のシステムだったのですが、10年ほど前にWEBシステムに切り替えました。
その時の謳い文句は「クライアント側で特別な設定が不要」だったと思うのですが、却って大変な手間がかかるようになった気がします。
結局、基幹システムのように長期間使用する前提のシステムは、クライアント側に専用のソフトをインストールするタイプの方が良い気がします。
投稿記事の一覧:http://harikofu.web.fc2.com/
--- blog end —
スポンサードリンク


