テーブルのある列を非表示にする方法

解決済

質問者：mania11
質問日時：2010/01/25 17:10
回答数：2件

非表示でなく削除でもいいんですが
テーブル列を非表示にする方法はありますか？

javascriptによって生成しない条件をつければいいと思うんですが
表自体がすでにjavascriptで生成されていてるので、ごちゃごちゃになりそうなのと
表も結構量があるので、処理が重くなってしまいそうです(今のところ考えつく方法では)

消したい物をすべてまとめて同じID的な物を振って置いて
そのIDを指定してdisplay:noneのようなスマートな非表示方法があれば、と思って探してます

classはデータセルごとにjavascriptで条件を見てつけています

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： fujillin
回答日時：2010/01/25 19:45

ご提示の表だと、セルの結合などは行なっていないみたいなので、もしそうならば、わざわざidやクラスを設定しなくても、単純にループをまわすだけでよいのでは？

以下サンプル（入力値のチェックの方に手間がかかってるくらい）

*1/3/5 と入力すれば1、3、5列が非表示になる。（0列始まり）
*表示させる場合は、1/2,ture みたいな感じ。
*<th>などは考慮してないけれど、そのへんはよしなに。

<html>
<head><title>test</title>
<script type="text/javascript">
function test() {
var arg = document.getElementById('inp').value.split(',');
if (!arg[0]) return;
arg[1] = arg[1] || false;
var c = [], i, tmp = arg[0].split('/');
for (i=0; i<tmp.length; i++) if (!isNaN(tmp[i])) c.push(tmp[i]);
column (document.getElementById('tbl0'), c, arg[1]);

function column(t, c, f) {
var i=0, j, r, td, tr = t.getElementsByTagName('TR');
while (r = tr[i++]) {
td = r.getElementsByTagName('TD');
for (j=0; n=c[j++];) if (td[n]) td[n].style.display = f?'inline':'none';
}
}
}
</script>
</head>

<body>
<table border="1" id="tbl0">
<tr>
<td>1-1</td><td>1-2</td><td>1-3</td><td>1-4</td>
<td>1-5</td><td>1-6</td><td>1-7</td><td>1-8</td>
</tr>
<tr>
<td>2-1</td><td>2-2</td><td>2-3</td><td>2-4</td>
<td>2-5</td><td>2-6</td><td>2-7</td><td>2-8</td>
</tr>
<tr>
<td>3-1</td><td>3-2</td><td>3-3</td><td>3-4</td>
<td>3-5</td><td>3-6</td><td>3-7</td><td>3-8</td>
</tr>
<tr>
<td>4-1</td><td>4-2</td><td>4-3</td><td>4-4</td>
<td>4-5</td><td>4-6</td><td>4-7</td><td>4-8</td>
</tr>
<tr>
<td>5-1</td><td>5-2</td><td>5-3</td><td>5-4</td>
<td>5-5</td><td>5-6</td><td>5-7</td><td>5-8</td>
</tr>
</table>
<hr>
行番号(複数行の場合「/」区切り), boolean（true:表示,false:非表示（省略可）<br>
<input type="text" id="inp" value="">
<input type="button" value="実行" onclick="test()">
</body>
</html>

*rowとかcellも使えるみたいなので、そのほうが考えやすいかも。
http://f32.aaa.livedoor.jp/%7Eazusa/index.php?t= …