Web覚書トップ > JavaScript サンプル > 『テキストボックスを入力不可にしてみる2』
説明

基本的には『テキストボックスを入力不可にしてみる』の応用になりますが、今回はIE(確認ver.5.5)でテキストボックスの背景色と文字の色を変えて、VBの「Enable=False」のような感じにしています。

実行例
▼チェックボックスをチェックすると、その列のテキストボックスが入力不可になります。
 
 
 

コード
function textAnable(obj, index) {
    if (document.all) {
        if (obj.checked) {
            obj.form.elements["text" + index].style.backgroundColor = "#aaaaaa";
            obj.form.elements["text" + index].style.color = "#666666";
        } else {
            obj.form.elements["text" + index].style.backgroundColor = "";
            obj.form.elements["text" + index].style.color = "";
        }
    }
}
function gotFocus(obj, index) {
    if (obj.form.elements["check" + index].checked) {
        obj.blur();
    }
}
<FORM>
<INPUT type="checkbox" onClick="textAnable(this, '1');" name="check1">
<INPUT type="text" name="text1" onFocus="gotFocus(this, '1');">
<INPUT type="checkbox" onClick="textAnable(this, '2');" name="check2">
<INPUT type="text" name="text2" onFocus="gotFocus(this, '2');">
<INPUT type="checkbox" onClick="textAnable(this, '3');" name="check3">
<INPUT type="text" name="text3" onFocus="gotFocus(this, '3');">
</FORM>

解説&ステップアップ

NN(確認ver.4.7)の場合は、単に入力不可になるだけです。

動作確認

IE4.0(win)、IE5.0(win)、IE5.5(win)、NN4.7(win)

© hyork@yahoo.co.jp (2001. 3.13)