忍者ブログ

からすまる日誌

selectによってtableを見えたり見えなくしたり

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

selectによってtableを見えたり見えなくしたり

  $('#table_a').css('display', 'none');
  $('#table_b').css('display', 'block');

と記述すればよいのでは?
→tableの幅が縮む現象発生。
(block要素になっているので当然)


解決法:
(select部分は割愛)
 
(html側)
 
<!--このブロックAと-->
<table hidden id="table_a">
  <tr>
   <td>aaa</td> 
  </tr>
</table>
 
<!--このブロックBの、表示非表示を切り替えたい-->
<table hidden id="table_b">
  <tr>
   <td>aaa</td> 
  </tr>
</table>
 
(js側)
 
$('#select_kind').on('change',function(){
 if(if (hoge=="1"){
  $('#table_a').css('display', 'none');
  $('#table_b').css('display', 'table');//ここをblockにしてしまうとtableが縮む
 }else{
  $('#table_a').css('display', 'table');
  $('#table_b').css('display', 'none');
 }
 
これでtableの幅が縮まない。

突き止めるのに半日もかかってしまいました。やれやれ。
 
PR

コメント

ブログ内検索

カレンダー

03 2025/04 05
S M T W T F S
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30