- ベストアンサー
テキストボックスの無効化について
function enableRadioBtn() { radiobutton_len = document.form1.radiobutton.length; for (i=0; i<radiobutton_len; i++) { document.form1.radiobutton[i].disabled = false; } } function disableRadioBtn() { radiobutton_len = document.form1.radiobutton.length; for (i=0; i<radiobutton_len; i++) { document.form1.radiobutton[i].disabled = true; } } 上記ソースの形式ではラジオボタンの無効化をループさせて行なっていますが、このような形式で複数のテキストボックスを無効化させることは出来ませんか？
- t_t1112
- お礼率82% (32/39)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
テキストボックスの名前を同じにする方法と テキストボックスのクラス名を同じにする方法 でサンプルを作ってみました どっちかというと、クラス名でくくりを同じくするのがいいんじゃないかと思います。 ---------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>Sample</title> <script type="text/javascript"><!-- function disableTextBoxByName(){ var txtBoxs = document.getElementsByName("inpTxt"); var tb_len = txtBoxs.length; for(i=0;i<tb_len;i++){ txtBoxs[i].disabled=true; } } function disableTextBoxByClass(f){ var len = f.elements.length; for(i=0;i<len;i++){ if(f.elements[i].className=="inpTxt"){ f.elements[i].disabled=true; } } } //--> </script> </head> <body> 名前を同じにする <form> <input type="text" name="inpTxt0" value="a"> <input type="text" name="inpTxt" value="b"> <input type="text" name="inpTxt" value="c"> <input type="text" name="inpTxt" value="d"> <input type="text" name="inpTxt" value="e"> <button type="button" onclick="disableTextBoxByName()">無効</button> </form> クラスを同じにする <form> <input type="text" name="inpTxt0" value="A"> <input type="text" class="inpTxt" name="inpTxt1" value="B"> <input type="text" class="inpTxt" name="inpTxt2" value="C"> <input type="text" class="inpTxt" name="inpTxt3" value="D"> <input type="text" class="inpTxt" name="inpTxt4" value="E"> <button type="button" onclick="disableTextBoxByClass(this.form)">無効</button> </form> </body> </html>
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
いっかつでやっていいなら、typeを見るのが一番。 その中で選別してやりたいなら、classでチェック するといいでしょう <script language="javascript"> function enableText(f,flg){ for(var i=0;i<f.length;i++){ if(f[i].type=="text") f[i].disabled=flg; } } </script> <form> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="text"><br> <input type="button" value="使用可" onClick="enableText(this.form,false)"> <input type="button" value="使用不可" onClick="enableText(this.form,true)"> </form>
お礼
ご回答ありがとうございました。 シンプルなソースですね。 参考にさせて頂きます。
関連するQ&A
- チェックボックスの選択チェック
ラジオボタンの選択チェック、セレクトボタンの選択チェックのあとにチェックボックスの選択チェックをしたいのですが、どのように入れればよいのでしょうか。教えてください。 ↓参考までに↓ function check() { var flag=0; if( document.form1.seibetu.length){ flag=1; var i; for(i=0; i<document.form1.seibetu.length; i++) if(document.form1.seibetu[i].checked)flag=false; } if(flag){ alert('性別が選択されていません'); return false; } if(document.form1.nenrei.value=="")flag=true; if(flag){ alert('年齢が選択されていません'); return false; } if( document.form1.Q1.length){ flag=1; var i; for(var i=0; i<document.form1.Q1.length; i++) if(document.form1.Q1[i].checked)flag=false; if(flag){ alert('Q1が選択されていません'); return false; } else {★★★ここに入れたい★★★ ;} } }
- 締切済み
- その他([技術者向] コンピューター)
- 選択肢によってラジオボタンを押せなくする(無効にする)
2.7.2.の質問があって、ラジオボタンの選択肢(１～５まで）によって、 １を選択したら、2.7.2.1のみ選択、その他はラジオボタン押せなくする 、２を選択すると、2.7.2.2のみ選択、その他はラジオボタン押せなくする 、３を選択すると、2.7.2.3のみ選択、その他はラジオボタン押せなくする ４、５を選択すると、2.7.2.1、2.7.2.2、2.7.2.3、すべてを押せなくして、submitボタンを押して次へという処理をしたいのですが、下記のプログラムではまったく動作しません。 どこが悪いのでしょうか？お分かりの方教えていただけませんか？ <script language="javascript"> <!-- function check(){ if(document.form1.BQ20[0].checked == true) { document.form1.BQ201.disabled = false; document.form1.BQ201.bgColor='#FFFFFF'; }else if(document.form1.BQ20[1].checked == true) { document.form1.BQ202.disabled = false; document.form1.BQ202.bgColor='#D4D0C8'; }else if(document.form1.BQ20[2].checked == true) { document.form1.BQ203.disabled = false; document.form1.BQ203.bgColor='#D4D0C8'; }else{ document.form1.BQ201.disabled = true; document.form1.BQ201.bgColor='#FFFFFF'; document.form1.BQ202.disabled = true; document.form1.BQ202.bgColor='#FFFFFF'; document.form1.BQ203.disabled = true; document.form1.BQ203.bgColor='#FFFFFF'; } } // --> </script> 以下省略
- 締切済み
- JavaScript
- テキストボックスを無効にすると値が取得できない
javascriptでこのようにテキストボックスを無効に してフォームを送信するとphp側でvalueの値が取得できないのですが、入力無効にすると valueは送られないんでしょうか？ <form> <input type="text" id="sample" name="sample" value="値" /> </form> スクリプト .document.getElementById('sample').disabled = true; valueにはphpで値をセットし、それをテキストボックスで編集できないようにして 値を飛ばそうとしたのですがテキストボックスのvalueの値が来てないようです。 自分なりに考えたんですが、送信する瞬間だけ（submitボタンが押された時） テキストボックスを有効に戻すようにコードを書いているのですが これ以外で何かありますか？ ---このように対処--- <form onsubmit="return disb()"> <input type="text" name="sample" value="値" /> </form> スクリプト document.getElementById('sample').disabled = true; function disb(f){ f.sample.disabled = false; }
- 締切済み
- JavaScript
- java script フォームのチェックボックス入力制限について
java script フォームのチェックボックス入力制限について どなたかお教えください。 以下のコードを書き換えて、現状では1つのチェックボックスを複数にし(かつ、複数選択可にし）、チェックボックスをチェックした場合のみ「選択肢」ラジオボタンがアクティブになる仕様にしたいと考えております。 サイト上で見つけたサンプルコードをいじっているのですが、何分素人なのでうまく行きません。どなたか助けていただけると助かります。 よろしくお願いします。 <script type="text/javascript"> function fchk3(obj){ var frm=obj.form; var len=frm.elements.length; if(obj.checked==true){ for(var i=0; i<len; i++){ if(frm.elements[i].type=="radio"){ frm.elements[i].disabled=false; } } }else{ for(var i=0; i<len; i++){ if(frm.elements[i].type=="radio"){ frm.elements[i].checked=false; frm.elements[i].disabled=true; } } } } </script> <form name="form3" action="#"> <label for="chk3"><input type="checkbox" id="chk3" name="chk3" onclick="fchk3(this)" checked="checked" />このボタンのチェックを外すとラジオボタンが無効化</label><br /> <label for="chk3_r1"><input type="radio" id="chk3_r1" name="r1" />選択肢</label> </form>
- ベストアンサー
- JavaScript
- オブジェクトを指定しても「Nullまたはオブジェクトではありません」となってしまう
Webページ作成にて、セレクトボックスを選択した時に選択内容によって、 同フォーム内にある特定のラジオボタンを無効にする処理を組んでいます。 セレクトボックスの[onChange]イベントに下記の[selectChange()]が 動くように記述しているのですが、どうしても 「Nullまたはオブジェクトではありません」とエラーとなってしまいます。 オブジェクト名のタイプミスなども含め何度も見直しましたが間違いありませんでした。 ちなみに、この関数と同じ場所に、ロールオーバーイメージをプリロード させる関数も記述しているのですがそちらは問題なく動いています。 （DreamWeaverが生成してくれるものですが・・） 原因として何が考えられるでしょうか。 分かる方お力をお貸し下さい。 //特定のラジオボタンを無効にする関数 function selectChange() { var selectedNum = document.FormName.SelectBox.selectedIndex; if(selectedNum == 1) { document.FormName.RadioButton[0].disabled = false; document.FormName.RadioButton[3].disabled = true; document.FormName.RadioButton[4].disabled = true; } else if(selectedNum >= 2){ document.FormName.RadioButton[0].disabled = true; document.FormName.RadioButton[3].disabled = false; document.FormName.RadioButton[4].disabled = false; } } //セレクトボックスの記述 <select name="SelectBox" onchange="selectChange()"> <option value=""></option> <option value=1>1</option> <option value=2>2</option> <option value=3>3</option> </select>
- ベストアンサー
- JavaScript
- ラジオボタンとセレクトボックスの選択チェック
ラジオボタン、セレクトボタンの選択チェックをしたいのですが 同時にチェックする場合どうすればよいのでしょうか。 失敗策ですが、参考までに↓ function check() { var flag=0; if( document.form1.seibetu.length){ flag=1; var i; for(i=0; i<document.form1.seibetu.length; i++){ if(document.form1.seibetu[i].checked){ flag=0; break; } } } else{ if(!document.form1.seibetu.checked){ flag=1; } } if(flag){ window.alert('性別が選択されていません'); return false; } else{ return true; } if(document.form1.nenrei.options[document.form1.nenrei.selectedIndex]. value==""){ flag=1; } if(flag){ window.alert('年齢が選択されていません'); return false; } else{return true; } }
- ベストアンサー
- その他([技術者向] コンピューター)
- 複数対応できるチェックボックスONでのテキストフィールド有効化
nameでなくidから値を取得する方法を模索中です。 下記のようにしてみましたが、 「オブジェクトでサポートされていない～」とでます。 どのあたりに問題がありますでしょうか？ <script type="text/javascript"> function fchk(obj,id) { var frm=obj.form; if(obj.checked==true) { /* テキストボックスを有効化（false）*/ for(var i=1; i<=2; i++){ frm.getElementById("t"+i).disabled=false; } } else { for(var i=1; i<=2; i++){ /* 無効化する前に、入力値をクリア */ if(id=='t'){ frm.getElementById("t"+i).value=""; } /* 無効化（true） */ frm.getElementById("t"+i).disabled=true; } } } </script> <form name="form" action="#"> <input type="checkbox" id="c1" name="aaa" value="オン" onclick="fchk(this,'t')" /> <br /> <input type="text" name="aaa" id="t1" value="" size="20" disabled/> <input type="text" name="aaa" id="t2" value="" size="20" disabled/> </form>
- ベストアンサー
- JavaScript
- 解決法をご教示下さい。
function Service_selectChange(f){ var selectedNum=document.form.Q4.selectedIndex; var len = f.elements.length; if(selectedNum == 0) { for(i=0;i<len;i++){ if(f.elements[i].className=="1Txt"){ f.elements[i].disabled=false; } if(f.elements[i].className=="2Txt" | f.elements[i].className=="3Txt"){ f.elements[i].disabled=true; f.elements[i].value=""; } if(f.elements[i].className=="2Radio1" | f.elements[i].className=="3Radio1"){ f.elements[i].disabled=true; f.elements[i].checked=false; } if(f.elements[i].className=="2Radio2" | f.elements[i].className=="3Radio2"){ f.elements[i].disabled=true; f.elements[i].checked=true; } if(f.elements[i].className=="2Select" | f.elements[i].className=="2Select"){ f.elements[i].disabled=true; f.elements[i].selectedIndex = 0; } } } 上記ソースでelementはNullまたはオブジェクトではありませんとエラーが出てしまいますが、 その原因を突き止めることが出来ません。 解決法をご教示下さい。よろしくお願い致します。
- ベストアンサー
- JavaScript
- セレクトボックスを無効に出来なくて困っています
このサイトで拝見したソースを参考に、ラジオボタンで選択した項目以外のテキストボックスなどが無効になる仕組みの、以下のようなフォームを作りました。 <form method="POST" name="form01"> <script language="javascript" type="text/javascript"> <!-- function swDis() { fObj = document.form01; fObj.sentaku01.disabled = (fObj.namae[0].checked) ? false : true ; fObj.sentaku02.disabled = (fObj.namae[1].checked) ? false : true ; fObj.sentaku03.disabled = (fObj.namae[2].checked) ? false : true ; } //--> </script> <p> <input type=radio name="namae" value="AAA" onclick="swDis()" checked /> sentaku01 <select name="sentaku01" id="sentaku01"> <option>選択肢１</option> <option>選択肢２</option> <option>選択肢３</option> </select> <br /> <input type=radio name="namae" value="BBB" onclick="swDis()" /> sentaku01 <input type=text name="sentaku02" disabled /> <br /> <input type=radio name="namae" value="CCC" onclick="swDis()" /> sentaku01 <input type=text name="sentaku03" disabled /> <br /> <input type=radio name="namae" value="sentaku04" onclick="swDis()" /> sentaku04<br /> <input name="" type="submit" value="送信する" /> </p> </form> しかし、この方法ですと、最初にフォームが表示された段階ではセレクトボックスが生きてしまい、他のいずれかのラジオボタンをクリックしないとセレクトボックスがグレーアウトしてくれません。 フォームが表示された時点ですぐにセレクトボックスをグレーアウトさせる方法はないでしょうか？ 対策をご存じの方がいらっしゃいましたらどうかよろしくお願い致します。
- ベストアンサー
- JavaScript
- 複数のラジオボタンの選択チェック
Q1とQ2の2問があり、ラジオボタンで回答を選択するようにしていますが、 ラジオボタンを選択しなかった場合、選択を促すようメッセージを表示させるようJavaScriptで以下のように作成してみましたがうまくいきません。 Q1とQ2の両方を選択しなかった場合、「Q1が選択されていません」とメッセージが表示されますが、Q1だけを選択してQ2を選択しなかった場合はメッセージが表示されません。 いろいろ調べてみたのですが、function checkの使い方に問題があるのでしょうか？ function check(){ var flag = 0; if(document.form1.Q1.length) { flag = 1; var i; for(i = 0; i < document.form1.Q1.length; i ++){ if(document.form1.Q1[i].checked){ flag = 0; break; } } } if(flag){ window.alert('Q1が選択されていません'); return false; } else{ return true; } var flag = 0; if(document.form1.Q2.length) { flag = 1; var i; for(i = 0; i < document.form1.Q2.length; i ++){ if(document.form1.Q2[i].checked){ flag = 0; break; } } } if(flag){ window.alert('Q2が選択されていません'); return false; } else{ return true; } }
- 締切済み
- JavaScript
お礼
お礼が遅くなり失礼しました。 遅い時間にも関わらずありがとうございました。 ど素人のためクラスという概念がありませんでした。 非常に参考になりました。