jQueryなど絡めてクライアントサイドの
処理を入れれば可能だと思いますが
マークアップの原則から考えればやるべきではありません
追記
ちなみにメニューだと考えず単にテーブルの表示/非表示をcaptionで行うという趣旨なら
こんな感じでどうでしょう?
HTML
1<table width=100>
2<caption class="class">メニュー</caption>
3<tbody>
4<tr>
5<th>1</th>
6<td>メニュー1</td>
7</tr>
8<tr>
9<th>2</th>
10<td>メニュー2</td>
11</tr>
12</tbody>
13</table>
- tableの幅を指定しておかないとcaptionがずれる
- javascriptでtableを操作するときにはブラウザごとの誤差を抑えるために
theadやtbodyはなるべく明示してください
javascript
1$(function(){
2 $('.class').siblings().css('display','none');
3 $('.class').click(function(){
4 var disp=$(this).siblings().css('display');
5 $(this).siblings().css('display',disp=='none'?'':'none');
6 });
7});
8
追記2
確実でなくてよければ以下が近いかも
セレクタの解釈などブラウザの違いが吸収しきれませんが
とくにIEなどはbehavior:expression()など使わないとダメかもしれません
css
1.on-off{display:none;}
2input[type="checkbox"].on-off + table>tbody{display:none;}
3input[type="checkbox"].on-off:checked + table>tbody{display:table;}
HTML
1<input type="checkbox" id="Panel1" class="on-off">
2<table class="menu" width=100>
3<caption class="class">
4<label for="Panel1">メニュー</label>
5</caption>
6<tbody>
7<tr>
8<th>1</th>
9<td>メニュー1</td>
10</tr>
11<tr>
12<th>2</th>
13<td>メニュー2</td>
14</tr>
15</tbody>
16</table>
補足
※idをきちんとつければ複数でもいけるはず
(古いIEを除く)
CSS
1.on-off{display:none;}
2input[type="checkbox"].on-off + table>tbody{display:none;}
3input[type="checkbox"].on-off:checked + table>tbody{display:table;}
4
HTML
1<input type="checkbox" id="Panel1" class="on-off">
2<table class="menu" width=100>
3<caption class="class">
4<label for="Panel1">メニューa</label>
5</caption>
6<tbody>
7<tr>
8<th>1</th>
9<td>メニュー1</td>
10</tr>
11<tr>
12<th>2</th>
13<td>メニュー2</td>
14</tr>
15</tbody>
16</table><input type="checkbox" id="Panel2" class="on-off">
17<table class="menu" width=100>
18<caption class="class">
19<label for="Panel2">メニューb</label>
20</caption>
21<tbody>
22<tr>
23<th>1</th>
24<td>メニュー1</td>
25</tr>
26<tr>
27<th>2</th>
28<td>メニュー2</td>
29</tr>
30</tbody>
31</table>
32<input type="checkbox" id="Panel3" class="on-off">
33<table class="menu" width=100>
34<caption class="class">
35<label for="Panel3">メニューc</label>
36</caption>
37<tbody>
38<tr>
39<th>1</th>
40<td>メニュー1</td>
41</tr>
42<tr>
43<th>2</th>
44<td>メニュー2</td>
45</tr>
46</tbody>
47</table>
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/09/12 02:49
2016/09/12 03:12
2016/09/12 03:23
2016/09/12 14:09
2016/09/13 05:51
2016/09/13 08:19
2016/09/13 09:09
2016/09/13 09:10
2016/09/13 09:16
2016/09/13 09:24