javascript操作表格

更新時間：2006年07月14日 00:00:00 作者：

<P><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>Power Table</title><style>body{ FONT-SIZE: 9pt; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px;}input { FONT-SIZE: 9pt; height: 15pt; width:50px; cursor: default;}table{ font-size: 9pt; word-break:break-all; cursor: default; BORDER: black 1px solid; background-color:#eeeecc; border-collapse:collapse; border-Color:#999999; align:center;}</style><TABLE width=100% border=1 cellSpacing=0 cellPadding=2 id="PowerTable"><TR align=middle bgColor=#ffcc00><TD>First Name</TD><TD>Last Name</TD><TD>Team</TD><TD>Engine</TD><TD>Tyres</TD><TD>Fastest Lap</TD><TD>國家</TD></TR><TR><TD>Michael</TD><TD>Schumacher</TD><TD>Ferrari</TD><TD>Ferrari</TD><TD>Bridgestone</TD><TD>1.15.872</TD><TD>德國</TD></TR><TR><TD>Rubens</TD><TD>Barrichello</TD><TD>Ferrari</TD><TD>Ferrari</TD><TD>Bridgestone</TD><TD>1.16.760</TD><TD>法國</TD></TR><TR><TD>Ralph</TD><TD>Schumacher</TD><TD>Williams</TD><TD>BMW</TD><TD>Michelin</TD><TD>1.16.297</TD><TD>美國</TD></TR><TR><TD>Juan-Pablo</TD><TD>Montoya</TD><TD>Williams</TD><TD>BMW</TD><TD>Michelin</TD><TD>1.17.123</TD><TD>柬埔寨</TD></TR><TR><TD>David</TD><TD>Coulthard</TD><TD>McLaren</TD><TD>Mercedes</TD><TD>Bridgestone</TD><TD>1.16.423</TD><TD>泰國</TD></TR><TR><TD>Mika</TD><TD>Hakkinen</TD><TD>McLaren</TD><TD>Mercedes</TD><TD>Bridgestone</TD><TD>1.16.979</TD><TD>越南</TD></TR><TR><TD>Jarno</TD><TD>Trulli</TD><TD>Jordan</TD><TD>Honda</TD><TD>Bridgestone</TD><TD>1.16.459</TD><TD>菲律賓</TD></TR><TR><TD>Ricardo</TD><TD>Zonta</TD><TD>Jordan</TD><TD>Honda</TD><TD>Bridgestone</TD><TD>1.17.328</TD><TD>英國</TD></TR><TR><TD>Olivia</TD><TD>Panis</TD><TD>BAR</TD><TD>Honda</TD><TD>Bridgestone</TD><TD>1.16.771</TD><TD>蒙古</TD></TR><TR><TD>Jacques</TD><TD>Villeneuve</TD><TD>BAR</TD><TD>Honda</TD><TD>Bridgestone</TD><TD>1.17.035</TD><TD>馬來西亞</TD></TR><TR><TD>Kimi</TD><TD>Raikkonen</TD><TD>Sauber</TD><TD>Petronas</TD><TD>Bridgestone</TD><TD>1.16.875</TD><TD>緬甸</TD></TR><TR><TD>Nick</TD><TD>Heidfeld</TD><TD>Sauber</TD><TD>Petronas</TD><TD>Bridgestone</TD><TD>1.17.165</TD><TD>朝鮮</TD></TR><TR><TD>Eddie</TD><TD>Irvine</TD><TD>Jaguar</TD><TD>Cosworth</TD><TD>Michelin</TD><TD>1.18.016</TD><TD>中國</TD></TR><TR><TD>Pedro</TD><TD>de la Rosa</TD><TD>Jaguar</TD><TD>Cosworth</TD><TD>Michelin</TD><TD>1.18.015</TD><TD>俄羅斯</TD></TR><TR><TD>Hugh</TD><TD>Gengine</TD><TD>Lotus</TD><TD>Renault</TD><TD>Michelin</TD><TD>1.15.015</TD><TD>韓國</TD></TR><TR><TD>Gloria</TD><TD>Slap</TD><TD>Lotus</TD><TD>Renault</TD><TD>Michelin</TD><TD>1.15.012</TD><TD>日本</TD></TR></TABLE><p><input type=button value=ins_row onclick=add_row(Main_Tab)><input type=button value=ins_col onclick=add_col(Main_Tab)><input type=button value=Del_row onclick=del_row(Main_Tab)><input type=button value=Del_col onclick=del_col(Main_Tab)><input type=button value=Restore onclick=res_tab(Main_Tab)><input type=button value=Export  onclick=exp_tab(Main_Tab)> ( Move: <input type=button id=move value=Up    onclick=Move_up(Main_Tab)><input type=button id=move value=Down  onclick=Move_down(Main_Tab)><input type=button id=move value=Left  onclick=Move_left(Main_Tab)><input type=button id=move value=Right onclick=Move_right(Main_Tab)> )漢字排序：<select id=sel_Mode onchange="charMode=this.selectedIndex"><option>拼音<option>筆畫</select><span style="cursor:hand; color: red; text-Decoration: underline" onclick="if(detail.style.display==''){detail.style.display='none';this.innerText='Show Detail'}else{detail.style.display='';this.innerText='Hide Detail'}">Show Detail</span></p><div   class="ublnpf9mb"   id=detail style="display:none"><input type=text id=monitor size=30 style="width:300px"><textarea id=showContent cols=100 rows=20></textarea><textarea cols=100 rows=20>主要特點：</P>
<P>任意標準數據表格（無跨行和跨列），只要設定 id 即可生效！</P>
<P>任意修改刪除編輯表格行列</P>
<P>倒出生成數據表</P>
<P>新加功能：漢字排序、拖動表頭交換列、修正幾個BUG、進一步增強表格的無關性（只要在 table 中加上 id=PowerTable 即可）~~~~~~</P>
<P>如果在較大的頁面中引用，請將 window.onload 事件的內容指向 PowerTable 之后！</P>
<P>寫的有點亂，而且沒有寫注釋，其實剛開始的時候僅僅是想實踐一下 insertRow ~~~~~</P>
<P>（相關顯示顏色操了點，不過可以通過變量定制）</textarea></div></P>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章: