行隐藏:
<BODY>
<TABLE border="1">
<TR>
<TD rowspan=3 width="100">123</TD><TD width="100">456</TD><TD width="100">789</TD>
</TR>
<TR>
<TD>def</TD><TD>ghi</TD>
</TR>
<TR>
<TD>mno</TD><TD>pqr</TD>
</TR>
</TABLE>
<BR>
<SCRIPT LANGUAGE="JavaScript">
function aaa(){
var table = document.all.tags('table')[0];
table.rows[2].style.display ="none";
table.rows[0].cells[0].rowSpan=2;
}
function bbb(){
var table = document.all.tags('table')[0];
table.rows[2].style.display ="";
table.rows[0].cells[0].rowSpan=3;
}
//-->
</SCRIPT>
<button οnclick="with(document.all.tags('table')[0].rows[2].style){display=display==''?'none':''}">test</button>
lt;br>
<button οnclick="aaa()">deleteRow</button>
<button οnclick="bbb()">addRow</button>
<BODY>
<TABLE border="1">
<TR>
<TD rowspan=3 width="100">123</TD><TD width="100">456</TD><TD width="100">789</TD>
</TR>
<TR>
<TD>def</TD><TD>ghi</TD>
</TR>
<TR>
<TD>mno</TD><TD>pqr</TD>
</TR>
</TABLE>
<BR>
<SCRIPT LANGUAGE="JavaScript">
function aaa(){
var table = document.all.tags('table')[0];
table.rows[2].style.display ="none";
table.rows[0].cells[0].rowSpan=2;
}
function bbb(){
var table = document.all.tags('table')[0];
table.rows[2].style.display ="";
table.rows[0].cells[0].rowSpan=3;
}
//-->
</SCRIPT>
<button οnclick="with(document.all.tags('table')[0].rows[2].style){display=display==''?'none':''}">test</button>
<br>
<button οnclick="aaa()">deleteRow</button>
<button οnclick="bbb()">addRow</button>列隐藏:
view plaincopy to clipboardprint?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title>Untitled Document</title>
</head>
<body>
<form id="MYFORM" name="MYFORM">
<script language="javascript">
function btnOnclick() {
var table = document.getElementById("MYTABLE");
for(i=0; i<table.rows.length; i++) {
td = table.rows[i].cells[3];
with(table.rows[i].cells[4]){
var display = style.display;
if(style.display == ''){
style.display = 'none';
td.width = "40%"
} else {
style.display = '';
td.width = "20%"
}
}
}
}
</script>
<table id="MYTABLE" name="MYTABLE" bordercolor="#000000" border="1" style="border-collapse:collapse" width="500px">
<TR>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 商品 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 単価 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 規格 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 単位 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 類別 </FONT> </TD>
</TR>
<TR>
<TD width= "20% "> aa </TD>
<TD width= "20% "> 1.00 </TD>
<TD width= "20% "> guige1 </TD>
<TD width= "20% "> 個 </TD>
<TD width= "20% "> 食品 </TD>
</TR>
<TR>
<TD width= "20% "> bb </TD>
<TD width= "20% "> 1.50 </TD>
<TD width= "20% "> guige2 </TD>
<TD width= "20% "> 台 </TD>
<TD width= "20% "> 果物 </TD>
</TR>
<TR>
<TD width= "20% "> cc </TD>
<TD width= "20% "> 1.00 </TD>
<TD width= "20% "> guige3 </TD>
<TD width= "20% "> 人 </TD>
<TD width= "20% "> 野菜 </TD>
</TR>
</table>
<br>
<input type="button" value="TEST" οnclick="btnOnclick()" >
</form>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title>Untitled Document</title>
</head>
<body>
<form id="MYFORM" name="MYFORM">
<script language="javascript">
function btnOnclick() {
var table = document.getElementById("MYTABLE");
for(i=0; i<table.rows.length; i++) {
td = table.rows[i].cells[3];
with(table.rows[i].cells[4]){
var display = style.display;
if(style.display == ''){
style.display = 'none';
td.width = "40%"
} else {
style.display = '';
td.width = "20%"
}
}
}
}
</script>
<table id="MYTABLE" name="MYTABLE" bordercolor="#000000" border="1" style="border-collapse:collapse" width="500px">
<TR>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 商品 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 単価 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 規格 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 単位 </FONT> </TD>
<TD width= "20% "> <FONT face= "MS UI Gothic "> 類別 </FONT> </TD>
</TR>
<TR>
<TD width= "20% "> aa </TD>
<TD width= "20% "> 1.00 </TD>
<TD width= "20% "> guige1 </TD>
<TD width= "20% "> 個 </TD>
<TD width= "20% "> 食品 </TD>
</TR>
<TR>
<TD width= "20% "> bb </TD>
<TD width= "20% "> 1.50 </TD>
<TD width= "20% "> guige2 </TD>
<TD width= "20% "> 台 </TD>
<TD width= "20% "> 果物 </TD>
</TR>
<TR>
<TD width= "20% "> cc </TD>
<TD width= "20% "> 1.00 </TD>
<TD width= "20% "> guige3 </TD>
<TD width= "20% "> 人 </TD>
<TD width= "20% "> 野菜 </TD>
</TR>
</table>
<br>
<input type="button" value="TEST" οnclick="btnOnclick()" >
</form>
</body>
</html>
网页中table的行隐藏和列隐藏
最新推荐文章于 2024-01-26 17:02:07 发布