table非表示列の選択
常にtableを表示する行に遭遇し、tableの列を隠す必要がある場合もある.
例えば、表には「名称」、「プロフィール」、「クリック数」、「発表時間」などがあり、今は発表時間を隠すなどを選択したい.次のテスト例を示します.
htmlページが2つありますindex.htmlとsub.html
index.html
sub.html
例えば、表には「名称」、「プロフィール」、「クリック数」、「発表時間」などがあり、今は発表時間を隠すなどを選択したい.次のテスト例を示します.
htmlページが2つありますindex.htmlとsub.html
index.html
<html>
<head>
<script>
function select_onClick(){
tempvalue = window.showModelessDialog("sub.html",window,"dialogHeight:570px;dialogWidth:650px;dialogTop:120px;dialogLeft:100px");
if(tempvalue!=null){
}
}
</script>
</head>
<body>
<table>
<tr>
<td colspan="4">
<input type="button" value=" " onclick="select_onClick()"></input>
</td>
</tr>
</table>
<table border="1">
<col id="col1">
<col id="col2">
<col id="col3">
<col id="col4">
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
, , ...
</td>
<td>
1000
</td>
<td>
2008-1-31 9:07:28
</td>
</tr>
<tr>
<td>
</td>
<td>
, :) , ……
</td>
<td>
1099
</td>
<td>
2008-1-1 9:07:45
</td>
</tr>
<tr>
<td>
</td>
<td>
, , ……
</td>
<td>
2333
</td>
<td>
2008-2-3 12:34:33
</td>
</tr>
<tr>
<td>
</td>
<td>
, 。……
</td>
<td>
788
</td>
<td>
2007-2-3 12:34:33
</td>
</tr>
</table>
</body>
</html>
sub.html
<html>
<head>
<script>
function h(){
var c = document.getElementsByName("cb");
var w=window.dialogArguments;
var s="";
for(var i = 0; i < c.length; i++){
var t = w.document.getElementById(c[i].value);
if(c[i].checked){
if(s==""){
s=c[i].value;
}else{
s=s+","+c[i].value;
}
t.style.display="";
}else{
t.style.display="none";
}
}
}
</script>
</head>
<body>
<table border="1">
<tr>
<td>
<input type="checkbox" name="cb" value="col1" checked> </input>
<input type="checkbox" name="cb" value="col2" checked> </input>
<input type="checkbox" name="cb" value="col3" checked> </input>
<input type="checkbox" name="cb" value="col4" checked> </input>
</td>
</tr>
<tr>
<td colspan="4">
<input type="button" value=" " onclick="h()"></input>
</td>
</tr>
</table>
</body>
</html>