JavaScriptでreadonly属性を操作

2006/12/13 15:50

JavaScriptのDOMを使って要素のreadonly属性を変更しようとするときには、readOnlyと書かなければならない。

初歩的だけど忘れているとハマる。

Firefoxでは小文字のreadonlyでも操作できるが、IEだとreadOnlyである必要がある。

IEの場合はreadonly状態でもinput要素の背景色は白のままなので、クラス名を変更するなどして背景色を変えるのがいい。

// via prototype.js
$("hoge").readOnly = "readonly";
Element.addClassName($("hoge"), "readonly");

disabledを使う手もあるが、disabledを使うとinput要素の値が送信されなくなる。readonlyなら送信される。時と場合によって使い分け。

Webエンジニアやってます。最近はドットインストールの開発がお仕事です。その傍ら、個人で Meity や電車遅延なう、梅酒.in、 #グラドル自画撮り部の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。