- ベストアンサー
テーブル列の表示／非表示機能の追加～その２
- AAAの列を常に表示させ、BBBを表示／非表示にする方法についての質問です。
- HTMLのスクリプトを使って、特定の列を非表示にする方法を教えてください。
- 上記のHTMLのコードを使って、変数bbbを取得して非表示にする方法がわかりません。
- ikeike77
- お礼率29% (5/17)
- JavaScript
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
同じような質問をしない方がよいです・・・。 かなり手を抜いてますがこういうことでどうでしょう？ <html> <head> <script> function hide(n) { var tags=document.getElementById("tbl1").getElementsByTagName("*"); for(var i=0;i<tags.length;i++){ var cn=tags[i].className; if(cn==n) tags[i].className=n+" hide"; if(cn==n+" hide") tags[i].className=n; } } </script> <style> .list1{ } .hide{ display:none; } </style> </head> <!--京--> <body> <input type="button" value="隠す/見せる" onClick="hide('list1')"> <table border="1" cellpadding="2" cellspacing="1" id="tbl1"> <tr> <th rowspan="3">AAA</th> <th colspan="3" class="list1">BBB</th> </tr> <tr> <th width="120" class="list1">BBB1</th> <th width="120" class="list1">BBB2</th> <th width="120" class="list1">BBB3</th> </tr> <tr> <th class="list1">BBB11</th> <th class="list1">BBB21</th> <th class="list1">BBB31</th> </tr> <tr> <td>aaa</td> <td class="list1">aaa1</td> <td class="list1">aaa2</td> <td class="list1">aaa3</td> </tr> <tr> <td>bbb</td> <td class="list1">bbb1</td> <td class="list1">bbb2</td> <td class="list1">bbb3</td> </tr> <tr> <td>ccc</td> <td class="list1">ccc1</td> <td class="list1">ccc2</td> <td class="list1">ccc3</td> </tr> </table> </body> </html>
お礼
ありがとうございました。 別の方の回答と組み合わせて、望みのものができました。