请问:动态表格的固定表头问题
表格tbItemList
<table id= "tbItemList " bodyHeight= "100 " bodyCSS= "tblBody " headerCSS= "tblHeader "
width= "75% " cellspacing=5 cellpadding=0 onRowClick = "onclick_tr() ">
<tr height= "20 " bgcolor= "#CCCCCC " align=center>
<td width= "25 " nowrap> 序号Item </td>
<td width= "100 " nowrap> 图号Part No </td>
<td width= "50 " nowrap> 版本号Edition </td>
<td width= "100 " nowrap> 名称Description </td>
<td width= "25 " nowrap> 数量Q 'ty </td>
<td style= "display:none "> 重量Weight </td>
<td style= "display:none "> 单位Unit </td>
<td style= "display:none "> 生效时间Start Time </td>
<td style= "display:none "> 失效时间End Time </td>
<td width= "200 " nowrap> 备注Remark </td>
</tr>
===========================================================================
表格内容是动态添加的,添加代码如下
window.attachEvent( "onload ",initInterface);
function initInterface()
{
读xml -> insertRow ...
}
===========================================================================
要对这个表格实行固定表头
不会!
===========================================================================
我用的微软网站上的一个方法,一个htc,原理是把table的表头表体拷出来,然后表头做表头,表体放到div
http://www.microsoft.com/china/MSDN/library/WebServices/WebServices/nacwebteam11042002.mspx?mfr=true
htc代码:
<PUBLIC:ATTACH event= "ondocumentready " handler= "onDocumentReady " />
<SCRIPT language= "JScript ">
function onDocumentReady()
{
// Create elements
var tblHeader = this.cloneNode(false);
var tblBody = this.cloneNode(false);
var divCntr = document.createElement( "DIV ");
// Get column widths
var rgWidths = new Array();
for (var i = 0; i < this.rows[0].cells.length; i++)
{
rgWidths[i] = this.rows[0].cells[i].offsetWidth;
}
// Add header row
var tbdyHeader = document.createElement( "TBODY ");
tblHeader.appendChild(tbdyHeader);
tbdyHeader.appendChild(this.rows[0].cloneNode(true));
// Add body rows
var tbdyBody = document.createElement( "TBODY ");
tblBody.appendChild(tbdyBody);
for (var i = 1; i < this.rows.length; i++)
{
var oRow = this.rows[i].cloneNode(true);
tbdyBody.appendChild(oRow);
}
// Set up body container
divCntr.style.overflow = "auto ";
if (this.bodyHeight) divCntr.style.height = this.bodyHeight;
divCntr.appendChild(tblBody);
// Change existing table
for (var i = this.rows.length; i > 0; i--)
{
this.rows[i-1].removeNode(true);
}
var tr1 = this.insertRow();
var td1 = tr1.insertCell();
var tr2 = this.insertRow();
var td2 = tr2.insertCell();
td1.appendChild(tblHeader);
td2.appendChild(divCntr);
// Set column widths of all but the last column
for (var i = 0; i < rgWidths.length - 1; i++)
{
tblHeader.rows[0].cells[i].width = rgWidths[i];
tblBody.rows[0].cells[i].width = rgWidths[i];
}
tblHeader.style.fontSize = "100% ";
tblHeader.width = "100% ";
tblHeader.style.tableLayout = "fixed ";
tblHeader.className = this.headerCSS ? this.headerCSS : " ";
tblHeader.border = 0;
tblBody.style.fontSize = "100% ";
tblBody.width = "100% ";
tblBody.style.tableLayout = "fixed ";
tblBody.className = this.bodyCSS ? this.bodyCSS : " ";
tblBody.border = 0;
this.cellSpacing = 0;
this.cellPadding = 0;
}
</SCRIPT>
[解决办法]
不是很明白,你要的是EXCEL中的固定表头的效果?
[解决办法]
好多~
懒得看
------解决方案--------------------
我是自己画的html表格,使用div是对的;主要是宽度需要全部使用象素来控制;不然会直线对不齐的;你说的问题没看懂什么意思
[解决办法]
呵呵,5点就下班了,现在才来看,自己解决了就好