0

刚发现<colgroup>标签。试图用它来切换列。适用于背景颜色之类的东西，但不能隐藏。

http://www.w3schools.com/tags/tag_colgroup.asp

table-column 也是一个显示属性，所以我在想，是的，太好了！

http://www.w3schools.com/cssref/pr_class_display.asp

不过好像没那么简单。线程和讨论倾向于深入到高级 jQuery。为什么是这样？

我的桌子是这样的：

<table style="vertical-align: middle;">
  <colgroup>
    <col id="c1">
    <col id="c2">
    <col id="c3">
    <col id="c4">
    <col id="c5">
  </colgroup>
      <tr id="d1">
        <td style="text-align: right; vertical-align: middle;">1/2 D note:</td>

等等

使用切换按钮：

<a href="javascript:toggleCol2();"><img src="/ico/ms.gif" class="ico" alt="X" title="toggle milli-seconds" id="col_ms">milli-seconds</a>

而这个JavaScript：

var Col2 = 1;

function toggleCol2() {
    if (Col2 == 0) {
        window.document.getElementById('c2').style.display = "table-column";
        window.document.getElementById('col_ms').style.opacity = "1";
        Col2 = 1;
    } else if (Col2 == 1) {
        window.document.getElementById('c2').style.display = "none";
        window.document.getElementById('col_ms').style.opacity = "0.2";
        Col2 = 0;
    }
}

从这个文件： http: //flamencopeko.net/bpm_calc.js

这是测试页面： http: //flamencopeko.net/bpm_calc_col.php

4

1 回答 1

0

为您需要的 col 标记的可见性属性使用折叠值。例如隐藏列 c2 使用： 

#c2 {
   visibility: collapse;
}

还要将折叠列的宽度归零，将 col 元素的宽度设置为 0，同时将 table 元素的 table-layout css 属性设置为固定值：

#c2 {
   visibility: collapse;
   width:0;
}

和

<table style="table-layout:fixed;...">
...
于 2014-01-20T09:24:04.177 回答