JavaScriptでreadonly

JavaScriptでtextフィールドやtextareaフィールドをすべて入力不可にしたい場合がある。その場合、



  <input type=text disabled=true>

とdisabled属性を使うことも可能だが、disabledを指定すると背景色は変更できるが前景色が変更できない。今回、入力画面と参照画面で同じJSPを使用し、参照画面の場合は、textフィールドを背景色を灰色、前景色を黒にしたいという仕様を満たすためには、readOnly属性を使うと良い。

このreadOnly属性はreadonlyではNGでreadOnlyでOが大文字でなければならない。ちょっとハマったので書いておく。

たとえば、入力画面とまったく同じで参照画面を作るときは、



 <body onload="javascript:readOnly()">

として以下のJavaScriptを呼び出すとすべて入力項目が入力不可になるので便利だ。(checkBoxなどは今回は対象外。もちろん、JSPは入力用と参照用で同じにするため、onload部分を入力用と参照用でパラメータを渡すか、function名を変えるかなどの工夫は必要。)





/**

 * すべてのtext, textareaフィールドをreadonlyにする

 * 

 * @return

 */

function readOnly(){

  for(i=0;i