the10Table.rows[0].cells[i].width
===>style.pixelWidth

解决方案 »

  1.   

    the11Table.rows[0].cells[i].pixelWidth=the11Table.rows[0].cells[i].offsetWidth;
    the11Table.rows[1].cells[i].pixelWidth=the11Table.rows[0].cells[i].offsetWidth;
      

  2.   

    sorry:
    你去掉那两个循环才是可以的(上面说错了)
      

  3.   

    Thanks 阿信。
    不过方法无效。---不知是不是我用错了。
      

  4.   

    <html>
    <head>
    <style>
    tr {background-color:expression((sectionRowIndex%2)?'e0e0e0':'eeeeee')};
    td{font-size:11}
    </style>
    </head><script language=javascript>
    function  changeColWidth()
    {
    if(the11Table.rows[0].style.display=="none")return false;
    var theThe10TableColsNum=the10Table.rows[0].cells.length;
    for(var i=0;i<theThe10TableColsNum-1;i++)
    {
    the10Table.rows[0].cells[i].width =the10Table.rows[0].cells[i].offsetWidth;
    the10Table.rows[1].cells[i].width =the10Table.rows[0].cells[i].offsetWidth;
    }
    var theThe11TableColsNum=the11Table.rows[0].cells.length;
    for(var i=0;i<theThe11TableColsNum;i++)
    {
    the11Table.rows[0].cells[i].width=the11Table.rows[0].cells[i].offsetWidth;
    the11Table.rows[1].cells[i].width=the11Table.rows[0].cells[i].offsetWidth;
    }
    the00Div.innerHTML="<table width='100%'  id=the00Table cellspacing='1' border='0' cellpadding='0' class='tdStyleNonEdit'>"
    +the10Table.rows[0].outerHTML+"</table>";
    the01Div.innerHTML="<table width='100%'  id=the01Table cellspacing='1' border='0' cellpadding='0' class='tdStyleNonEdit'>"
    +the11Table.rows[0].outerHTML+"</table>";
    the11Table.style.width=the11Table.offsetWidth;//加了这一句。
    the10Table.rows[0].style.display="none";
    the11Table.rows[0].style.display="none";

    alert(the11Table.rows[1].outerHTML);

    }</script><body>
    <input type=button value="Fix the head tr" onclick="changeColWidth()">
    <table width='100%' border='0'  cellspacing='0' cellpadding='0'>
    <tr>
    <td valign=top width=80%>
    <div style="overflow-x:hidden;overflow-y:hidden;" id=the00Div >
    </div></div>
    <div id=the10Div style="height:100;overflow-x:hidden;overflow-y:auto;" onscroll= "the11Div.scrollTop=scrollTop ">
    <table id=the10Table width='100%' cellspacing='1' border='0' cellpadding='0' >
    <tr height=22>
    <td nowrap >Thank you!</td>
    <td nowrap >You are welcome!</td>
    </tr> 
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr></table>
    <br>
    </div>
    </td>
    <td valign=top >
    <div id=the01Div style="width:450;overFlow-x:hidden;overflow-y:hidden;" onscroll= "the11Div.scrollLeft=scrollLeft ">
    </div>
    <div id=the11Div style="width:450; height:100;overFlow-x:auto;overflow-y:hidden;" onscroll= "the10Div.scrollTop=scrollTop;the01Div.scrollLeft=scrollLeft;">
    <table id=the11Table width='100%' cellspacing='1' border='0' cellpadding='0' >
    <tr height=22>
    <td nowrap >How are you? How are you?How are you? How are you?How are you? How are you?How are you? How are you? </td>
    <td nowrap >I am fine</td>
    </tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr></table>
    <br>
    </div>
    </td>
    </tr>
    </table>
    </body>
    </html>
      

  5.   

    OK啦。<html>
    <head>
    <style>
    tr {background-color:expression((sectionRowIndex%2)?'e0e0e0':'eeeeee')};
    td{font-size:11}
    </style>
    </head><script language=javascript>
    function  changeColWidth()
    {
    if(the11Table.rows[0].style.display=="none")return false;
    var theThe10TableColsNum=the10Table.rows[0].cells.length;
    for(var i=0;i<theThe10TableColsNum-1;i++)
    {
    the10Table.rows[0].cells[i].width =the10Table.rows[0].cells[i].offsetWidth;
    the10Table.rows[1].cells[i].width =the10Table.rows[0].cells[i].offsetWidth;
    }
    var theThe11TableColsNum=the11Table.rows[0].cells.length;
    for(var i=0;i<theThe11TableColsNum;i++)
    {
    the11Table.rows[0].cells[i].width=the11Table.rows[0].cells[i].offsetWidth;
    the11Table.rows[1].cells[i].width=the11Table.rows[0].cells[i].offsetWidth;
    }
    the00Div.innerHTML="<table width='100%'  id=the00Table cellspacing='1' border='0' cellpadding='0' class='tdStyleNonEdit'>"
    +the10Table.rows[0].outerHTML+"</table>";
    the01Div.innerHTML="<table width='100%'  id=the01Table cellspacing='1' border='0' cellpadding='0' class='tdStyleNonEdit'>"
    +the11Table.rows[0].outerHTML+"</table>";
    the11Table.style.width=the11Table.offsetWidth;
    the01Div.style.width=the11Div.style.width;
    the10Table.rows[0].style.display="none";
    the11Table.rows[0].style.display="none";

    alert(the11Table.rows[1].outerHTML);

    }</script><body>
    <input type=button value="Fix the head tr" onclick="changeColWidth()">
    <table width='100%' border='0'  cellspacing='0' cellpadding='0'>
    <tr>
    <td valign=top width=80%>
    <div style="overflow-x:hidden;overflow-y:hidden;" id=the00Div >
    </div><div id=the10Div style="height:100;overflow-x:hidden;overflow-y:auto;" onscroll= "the11Div.scrollTop=scrollTop ">
    <table id=the10Table width='100%' cellspacing='1' border='0' cellpadding='0' >
    <tr height=22>
    <td nowrap >Thank you!</td>
    <td nowrap >You are welcome!</td>
    </tr> 
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr></table>
    <br>
    </div>
    </td>
    <td valign=top >
    <div id=the01Div style="overFlow-x:hidden;overflow-y:hidden;" onscroll= "the11Div.scrollLeft=scrollLeft ">
    </div><div id=the11Div style="width:450; height:100;overFlow-x:auto;overflow-y:hidden;" onscroll= "the10Div.scrollTop=scrollTop;the01Div.scrollLeft=scrollLeft;">
    <table id=the11Table width='100%' cellspacing='1' border='0' cellpadding='0' >
    <tr height=22>
    <td nowrap >How are you? How are you?How are you? How are you?How are you? How are you?How are you? How are you? </td>
    <td nowrap >I am fine</td>
    </tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr>
    <tr height=22><td>a</td><td>&nbsp;</td></tr></table>
    <br>
    </div>
    </td>
    </tr>
    </table>
    </body>
    </html>