導航:首頁 > 編程語言 > javascripttdwidth

javascripttdwidth

發布時間:2024-08-17 22:27:22

1. 可以用js腳本重新調整列寬和行高嗎

可以,代碼如下


<!DOCTYPEHTML>
<html>
<head>
<metacharset="gbk">
<title>table</title>
</head>
<body>
<tableid="tb_1"cellspacing="0"cellpadding="2"width="100%"border="1">
<tbody>
<tralign="center"bgcolor="#dcdcdc">
<tdstyle="width:100px;">用戶編號</td>
<td>試用時間</td><td>轉正時間</td><td>性別</td><td>姓名拼音</td>
<td>生日時間</td><td>民族</td><td>身高</td>
</tr>
<tr>
<td>2000001</td>
<td>1997-3-13</td><td>1997-3-13</td><td>1</td><td>WZJ</td>
<td>1965-3-13</td><td>漢</td><td>171</td>
</tr>
<tr>
<td>2000045</td>
<td>2001-2-15</td><td>2001-3-15</td><td>0</td><td>WY</td>
<td>1978-8-5</td><td>漢</td><td>162</td>
</tr>
<tr>
<td>2000046</td>
<td>2001-2-23</td><td>2001-3-23</td><td>0</td><td>LQ</td>
<td>2001-2-23</td><td>漢</td><td>171</td>
</tr>
</tbody>
</table>
<scripttype="text/javascript">
vartTD;//用來存儲當前更改寬度的TableCell,避免快速移動滑鼠的問題
vartable=document.getElementById("tb_1");
for(j=0;j<table.rows[0].cells.length;j++){
table.rows[0].cells[j].onmousedown=function(){
//記錄單元格
tTD=this;
if(event.offsetX>tTD.offsetWidth-10){
tTD.mouseDown=true;
tTD.oldX=event.x;
tTD.oldWidth=tTD.offsetWidth;
}
//記錄Table寬度
//table=tTD;while(table.tagName!=『TABLE')table=table.parentElement;
//tTD.tableWidth=table.offsetWidth;
};
table.rows[0].cells[j].onmouseup=function(){
//結束寬度調整
if(tTD==undefined)tTD=this;
tTD.mouseDown=false;
tTD.style.cursor='default';
};
table.rows[0].cells[j].onmousemove=function(){
//更改滑鼠樣式
if(event.offsetX>this.offsetWidth-10)
this.style.cursor='col-resize';
else
this.style.cursor='default';
//取出暫存的TableCell
if(tTD==undefined)tTD=this;
//調整寬度
if(tTD.mouseDown!=null&&tTD.mouseDown==true){
tTD.style.cursor='default';
if(tTD.oldWidth+(event.x-tTD.oldX)>0)
tTD.width=tTD.oldWidth+(event.x-tTD.oldX);
//調整列寬
tTD.style.width=tTD.width;
tTD.style.cursor='col-resize';
//調整該列中的每個Cell
table=tTD;while(table.tagName!='TABLE')table=table.parentElement;
for(j=0;j<table.rows.length;j++){
table.rows[j].cells[tTD.cellIndex].width=tTD.width;
}
//調整整個表
//table.width=tTD.tableWidth+(tTD.offsetWidth–tTD.oldWidth);
//table.style.width=table.width;
}
};
}
</script>
</body>
</html>
閱讀全文

與javascripttdwidth相關的資料

熱點內容
專題學習網站源碼 瀏覽:163
jsphead什麼 瀏覽:88
gps串口數據怎麼發送 瀏覽:968
win10文件主頁共享查看 瀏覽:411
中國聯通有哪些app是免流的 瀏覽:176
邊做邊保存的文件找不到了 瀏覽:858
win10照片應用文件夾名稱 瀏覽:966
編程如何解決資金的原子性 瀏覽:638
如何製作廣角鏡頭矯正文件 瀏覽:513
在網頁開發中應該選用哪個資料庫 瀏覽:742
iphone5移動卡貼 瀏覽:990
電腦文件的格式 瀏覽:127
extjs的xtype 瀏覽:959
suse11iso文件要u盤安裝 瀏覽:153
如何將報表統計數據轉化為圖形 瀏覽:444
如何寄快遞材料文件 瀏覽:265
java構造方法private 瀏覽:475
手機文件找回恢復 瀏覽:516
word怎麼把u盤里的文件拔掉 瀏覽:976
港版蘋果用的插排 瀏覽:1000

友情鏈接