いつもお世話になってます。
###前提・実現したいこと
ラジオボタンやチェックボックスを選択したときにテキストボックスを表示したいと考えています。
下記のようなidで表示非表示を行う方法は理解しているのですが、
javascript
1 function showRadio( disp ) { 2 document.getElementsById('radio').style.display = disp; 3} 4function showCheck( disp ) { 5 document.getElementsById('check').style.display = disp; 6}
↓inputの部分を繰り返しで表示しているのでidを使うことができません。
html
1<form action ="send.php" method="post" id="form" class="form"><div class="bgc"> 2<h1 align="center">テスト</h1> 3<div class="question" align="center"> 4<p>Q1.くえすちょん</p> 5<p align="left" style="display:inline-block;"> 6<input type='radio' name='question1' value='ラジオ1' onclick='showRadio('none');'> 7ラジオ1<br> 8<input type='radio' name='question1' value='ラジオ2' onclick='showRadio('none');'> 9ラジオ2<br> 10<input type='radio' name='question1' value='ラジオ3' onclick='showRadio('none');'> 11ラジオ3<br> 12<input type='hidden' name='question_id' value='6'> 13</p> 14</div> 15<div class="question" align="center"> 16<p>Q2.くえすちょん</p><p align="left" style="display:inline-block;"> 17<input type='radio' name='question3' value='ラジオ1' onclick='showRadio('none');'> 18ラジオ1<br><input type='radio' name='question3' value='らじお2' onclick='showRadio('none');'> 19らじお2<br><input type='radio' name='question3' value='sonota' onclick='showRadio('block');'> 20その他<br><input type='text' name='question3' value='' class='radio'> 21<input type='hidden' name='question_id' value='6'> 22<div class="question" align="center"> 23<p>くえすちょん</p> 24<p align="left" style="display:inline-block;"> 25<input type='checkbox' name='question8[]' value='チェック1' onclick='showCheck('none');'> 26チェック1<br><input type='checkbox' name='question8[]' value='チェック2' onclick='showCheck('none');'> 27チェック2<br><input type='checkbox' name='question8[]' value='チェック3' onclick='showCheck('none');'> 28チェック3<br><input type='checkbox' name='question8' value='sonota' onclick='showCheck('block');'> 29その他<br><input type='text' name='question8' value='' class='check'><input type='hidden' name='question_id' value='6'> 30</p> 31</div> 32<div class="question" align="center"> 33<p>くえすちょん</p> 34<p align="left" style="display:inline-block;"><input type='checkbox' name='question9[]' value='チェック1' class='checkBtn' onclick='showCheck('none');'> 35チェック1<br><input type='checkbox' name='question9[]' value='チェック2' class='checkBtn' onclick='showCheck('none');'> 36チェック2<br><input type='checkbox' name='question9[]' value='チェック3' class='checkBtn' onclick='showCheck('none');'> 37チェック3<br><input type='checkbox' name='question9' value='sonota' onclick='showCheck('block');'> 38</p> 39</div> 40 41<input type='hidden' name='question_id' value='1'></p></div><div class="submitBtn" align="right"> 42<input type="submit" value="送信する" id="send" class="send" name="send" style="width:100px; height:30px;"> 43</div> 44</form> 45</div> 46</body>
ですのでgetElementsByClassNamesを用いて行おうと思い、下記コードを書いて実行してみようとしたのですが、実行されませんでした。
javascript
1function showRadio( disp ) { 2 document.getElementsByClassName('radio').style.display = disp; 3} 4function showCheck( disp ) { 5 document.getElementsByClassName('check').style.display = disp; 6}
idとclassとで書き方が違うのでしょうか?
ご教授の方お願い致します。
###試したこと
ダメ元でidを指定して実行してみましたがやはり実行されませんでした。
###補足情報(言語/FW/ツール等のバージョンなど)
PHP バージョン5.3.1
###追記
('radio')はラジオボタン項目にその他があった場合、その他を選択した際に表示を行いたいです。
('check')はチェックボタン項目にその他があった場合、その他を選択した際に表示を行いたいです。
現在のスクリプトはこの様な感じです。
javascript
1<script type="text/javascript"> 2function showRadio(disp){ 3 var elR, elems = document.getElementsByClassName('radio'); 4 for(elR=0; elR<elems.length; ++elR){ 5 if(elems[elR]!= disp){ 6 elems[elR].style.display = disp; 7 } 8 } 9} 10 11function showCheck(disp){ 12 var elC, elems = document.getElementsByClassName('check'); 13 for(elC=0; elC<elems.length; ++elC){ 14 if(elems[elC]!= disp){ 15 elems[elC].style.display = disp; 16 } 17 } 18} 19</script>
追記2
PHP
1 for($j=1; $j<=10; $j++){ 2 if($col['format']==$frmtR){ 3 //ラジオボタン 4 if($col['answer'.$j]){ 5 if($col['required'.$k]){ 6 echo"<input required type='radio' name='question{$question_count}' value='".$col['answer'.$j]."' onclick='showRadio('none');'>".$col['answer'.$j].'<br>'; 7 }else{ 8 echo"<input type='radio' name='question{$question_count}' value='".$col['answer'.$j]."' onclick='showRadio('none');'>".$col['answer'.$j].'<br>'; 9 } 10 11 } 12 }elseif($col['format']==$frmtC){ 13 //チェックボックス 14 if($col['answer'.$j]){ 15 if($col['required'.$k]){ 16 echo"<input type='checkbox' name='question{$question_count}[]' value='".$col['answer'.$j]."' class='checkBtn' onclick='showCheck('none');'>".$col['answer'.$j].'<br>'; 17 }else{ 18 echo"<input type='checkbox' name='question{$question_count}[]' value='".$col['answer'.$j]."' onclick='showCheck('none');'>".$col['answer'.$j].'<br>'; 19 } 20 } 21 } 22 } 23 24 if($col['format']==$frmtT){ 25 //テキストエリア 26 if($col['required'.$k]){ 27 echo "<input type='text' name='question{$question_count}' value='' required><br>"; 28 }else{ 29 echo "<input type='text' name='question{$question_count}' value=''><br>"; 30 } 31 } 32 33 //その他 34 if($col['other'.$k]){ 35 if($col['format']==$frmtR){ 36 echo "<input type='radio' name='question{$question_count}' value='".$col['other'.$j]."' onclick='showRadio('block');' class='forsonota'>"; 37 echo "その他<br><input type='text' name='question{$question_count}' value='' class='radio sonota'>"; 38 }elseif($col['format']==$frmtC){ 39 echo "<input type='checkbox' name='question{$question_count}' value='".$col['other'.$j]."' onclick='showCheck('block');' class='forsonota'>"; 40 echo "その他<br><input type='text' name='question{$question_count}' value='' class='check sonota'>"; 41 } 42 }
回答6件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/12/15 07:51
2016/12/15 07:59
2016/12/15 08:09
2016/12/16 02:11
2016/12/16 02:40
2016/12/16 02:49
2016/12/16 03:01
2016/12/16 03:09
2016/12/16 03:20