动态表单问题

<body onload="eval('document.all.'+document.all.heads.value+'.style.width=document.all.mywidth.value')">
<table border=1>
<tr><th id=h1>head1</th><th id=h2>head2</th><th id=h3>head3</th></tr>
<tr><td>bayern11</td><td>bayern12</td><td>bayern13</td></tr>
<tr><td>bayern21</td><td>bayern22</td><td>bayern23</td></tr>
<tr><td>bayern31</td><td>bayern32</td><td>bayern33</td></tr>
<tr><td>bayern41</td><td>bayern42</td><td>bayern43</td></tr>
<tr><td>bayern51</td><td>bayern52</td><td>bayern53</td></tr>
</table>
<select id=heads onchange="eval('document.all.'+document.all.heads.value+'.style.width=document.all.mywidth.value')">
<option value=h1 selected>h1
<option value=h2>h2
<option value=h3>h3
</select>
<select id=mywidth onchange="eval('document.all.'+document.all.heads.value+'.style.width=this.value')">
<option value=200 selected>200
<option value=300>300
<option value=400>400
</select>

解决方案 »

  1.   

    呵呵，我也来试试。<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>emu's resize table code</title>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    var startx=0;
    var mousePress=false;
    var destElm;
    var oldWidth=40;
    function down()
    {
    startx = event.x;
    mousePress=true;
    with (event.srcElement)
    destElm = parentNode.cells[cellIndex-1]
    oldWidth = destElm.offsetWidth;
    }
    function up()
    {
    mousePress=false;
    }
    function move()
    {
    if (!mousePress) return;
    var d=event.x-startx+oldWidth;
    if (d>0) destElm.width=d;
    }
    //-->
    </SCRIPT>
    <style>
    .left {border-left:1px solid black}
    .top {border-top:1px solid black}
    .left-top {border-top:1px solid black;border-left:1px solid black}
    TABLE{border:1px solid black}
    </style>
    </head>
    <body onmousemove=move() onmouseup=up()>
    <table>
    <tr>
    <td>abcd</td><td style="cursor:e-resize;" onmousedown=down()></td>
    <td class=left>abcd</td><td style="cursor:e-resize" onmousedown=down()></td>
    <td class=left>abcd</td><td style="cursor:e-resize" onmousedown=down()></td>
    <td class=left>abcd</td><td style="cursor:e-resize" onmousedown=down()></td>
    </tr>
    <tr>
    <td colspan=2 class=top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    </tr>
    <tr>
    <td colspan=2 class=top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    <td colspan=2 class=left-top>hello</td>
    </tr>
    </table></body>
    </html>