テキストフィールドへの入力を禁止するには？

質問

「JavaScript例文辞典」で掲載されている「テキストフィールドへの入力を禁止する」方法ですが....
↓
http://www.openspc2.org/reibun/javascript/form_textfield/007/index.html

これを「入力禁止」と「入力可能」ボタンで切り替えていますが。そうではなくて、選択できない、最初から入力できない方法はどうやりますか？

単にテキストフィールドへの入力を禁止したいだけなので、他の書き方があれば教えて下さい。

回答No.8

leaz024 · ベストアンサー

disabled も ネスケ４では動作しません。
どのブラウザでも入力不可にするには、No.1の回答にある「onFocus="this.blur()"」を使うしかありませんが、これだってJavaScriptがOFFだと無効です。

絶対に値を変えさせたくないのなら、送信用に hidden を使い、表示用に name なしの text を使ってはどうでしょうか。

<input type="hidden" name="name" value="xxx">
<input type="text" value="xxx" onFocus="this.blur()" style="background:#CCCCCC">

text の方は name が無いので送信されません。
ネスケ４では効きませんが、スタイルシートで背景色を変えれば、それなりには見えます。
これなら、たいていは書き換え不能ですし、最悪書き換えられてもデータは保護されます。

お礼

返事遅れまして申し訳ございません。アドバイスの通りIEもNNも対応できました！感動しました！！styleはバックグランドではなくて文字色を薄ブルにしました。
ありがとうございました。

回答No.7

kirara999

こんな感じで出来ますけど。。。
サーバにも
text1=てすと
がpostされます。

<form name="F1" method="post" action="/hohoho.do">
<input type="text" name="text1" value="てすと" disabled><BR>
<input type="submit" name="Submit" value="送信" onclick="document.F1.text1.disabled=false;">
</form>

回答No.6

kirara999

表示時にはdisable=trueにしておいて、submitボタン押下時にdisable=false
にしてサーバに送信するのがいいかと思います。

お礼

押下時だけdisable=falseにするにはどう書くでしょうか？
いろいろ試しにやりましたが、やはり送信しなくなるです...

回答No.5

shorn

readOnlyはIEのみの機能だったような・・・

お礼

アドバイスありがとうございます。
IEとネスケ両方対応する方法はありますか？

回答No.4

kirara999

先ほどの回答の一部訂正です。
readonlyではなくreadOnlyでした。
これで、以下のようにJavaScriptからreadOnly属性を変更することができます。

<FORM name="FORM1">
<INPUT type="text" name="kore" value="hohoho" size="100" readOnly>
<BUTTON type="button"　onClick="window.document.FORM1.kore.readOnly=false;">書込不可</BUTTON>
<BUTTON type="button"　onClick="window.document.FORM1.kore.readOnly=true;">書込可</BUTTON>

お礼

ご回答ありがとうございました。
確かに指摘の通りdisableにするとデータは渡さなくなるので、readOnlyを使えば完璧です！
文字の色はINPUT STYLEで似たような感じにしました。
お陰様でなんとか希望通りにできましたので、ありがとうございました。

回答No.3

kirara999

JavaScriptでなくてHTMLでできます。

<INPUT type="text" name="kore" value="hohoho" disabled>
とやれば入力できなく、文字がグレイになります。
しかし、submitボタンでサーバに送信したい時、送信されなくなります。
(リクエストに含まれない)

<INPUT type="text" name="kore" value="hohoho" readonly>
とやれば入力できないですが、サーバに送信されます。
但し、文字はグレイになりません。ネスケ6はだめだったような？？？

で、以下のようにすればdisabled属性をJavaScriptから変更できます。

<FORM name="FORM1">
<INPUT type="text" name="kore" value="hohoho" size="100" disabled>
<BUTTON type="button"　onClick="window.document.FORM1.kore.disabled=false;">表示</BUTTON>
<BUTTON type="button"　onClick="window.document.FORM1.kore.disabled=true;">非表示</BUTTON>

回答No.2

wolv

<table border ><td width=200><font color=#aaaaaa>変更できない文字列</font></td></table>

こうとか＾＾；

変更や入力して欲しくないのに、テキストフィールドを使いたい理由はなんですか？

お礼

ありがとうございます。
アドバイスのようにしても文字色は変わりませんでしたが、
<input style="color : cornflowerblue;" type=text name="name" readOnly>
このようにするとなんとか似たような感じでした、ありがとうございました。

補足

入力してほしくない理由は同じデータベースを使ってユーザーによって編集できるとできない項目を分けたいためです。

回答No.1

wolv

<input type="text" onFocus="this.blur()">
でいいんじゃないでしょうか。

参考URL：

http://www.openspc2.org/reibun/javascript/form_textfield/007/index.html

お礼

ありがとうございます。
確かにこれで入力できないようになりましたが、フィールド内の文字(フィールドボックス)の色をグレイにすることは可能でしょうか？要するに一目で見て入力できないことがわかるようにしたいですが...