setTableTd_width.js 文件路徑找不到無法掩飾啊  回復  更多評論
  

@hong
/*****************************************************
* 說明：
* 這是js部分，可以把它存為一個js文件鏈到HTML文件中。
* js中還有一些BUG，希望大家可以幫我改一下。
* BUG現象是當快速拖動單元格時，會出現突然單元格變大的情況。
****************************************************/
var pre_currentTd_width = ""; // 空單元格的前一個格的寬度
var currentTd_width = ""; // 單元格的寬度
var downX; // 返回鼠標按下時的X坐標
var maxLength_col = 100; // 每個單元格的最大寬度

function $(id){
return document.getElementById(id);
}

//------------ 給單元格施加onmouseover事件 --------------
document.onmouseover = function(){
var element_td = event.srcElement; // 返回鼠標放上時單元格的對象
if(event.srcElement.getAttribute("name") == "set"){
document.body.style.cursor = "e-resize";
pre_currentTd_width = element_td.previousSibling.offsetWidth; // 放上時返回單元格前一個單元格的相對寬度
currentTd_width = element_td.offsetWidth; // 放上時返回單元格的相對寬度
}
}

document.onmouseout = function(){
document.body.style.cursor = "";
document.onmousemove = "";
}

document.onselectstart = function(){
return false;
}

//------------ 鼠標按下單元格時的變化 --------------
function td_onmousedown(){
var element_td = event.srcElement; // 返回鼠標按下時單元格的對象
downX = event.clientX;
document.body.style.cursor = "e-resize";

if(document.body.style.cursor == "e-resize"){
document.onmousemove = td_onmousemove;
}

document.onmouseup = function(){
document.onmousemove = null;
document.body.style.cursor = "default"
}
}

function td_onmousemove(){
var element_td = event.srcElement; // 返回鼠標移動時單元格的對象
var preTd_width = event.clientX + pre_currentTd_width - downX; // 鼠標移動時，前一個單元格的實際寬度
var Td_width = currentTd_width - (preTd_width - pre_currentTd_width); // 鼠標移動時，單元格的實際寬度
var current_col_max; // 當前單元格的前一個單元格處于最小寬度時，存放當前單元格的最大寬度
var pre_col_max; // 當前單元格的處于最小寬度時，存放前一個單元格的最大寬度

try{
if(element_td.getAttribute("name") == "set"){
$("inner").innerHTML = "clientX: " + event.clientX + "<br><br>downX: "+ downX +"<br><br>前一個單元格offsetWidth寬度: " + pre_currentTd_width + "<br><br>前一個單元格"+ element_td.previousSibling.id +"的實際寬度: " + (event.clientX + pre_currentTd_width - downX) +
"<br><br>當前單元格"+ element_td.id +"的實際寬度: " + Math.abs(Td_width) + "<br><br>表格的寬度: " + $("oTable").offsetWidth;
if(preTd_width > maxLength_col && Td_width > maxLength_col && $("oTable").width == 900){
element_td.previousSibling.width = Math.abs(preTd_width) + "px";
element_td.width = Math.abs(Td_width) + "px";

//-------- 存放單元格的最大寬度 -------
current_col_max = Math.abs(Td_width);
pre_col_max = Math.abs(preTd_width);
}
else if(preTd_width < maxLength_col){ // 向左拖拽
element_td.previousSibling.width = maxLength_col + "px";
element_td.width = current_col_max + "px";
}
else if(Td_width < maxLength_col){ // 向右拖拽
element_td.previousSibling.width = pre_col_max + "px";
element_td.width = maxLength_col + "px";
document.onmousemove = "";
}
else if($("oTable").width > 900){
$("oTable").width = "900px";
}
}
}catch(e){ }
}
//--------------------- 程序部分結束 ----------------

/************************************************
* 說明：
* 以下部分是HTML部分，可以將上一個js文件鏈到文件中
***********************************************/  回復  更多評論
  

原文出處：http://blog.sina.com.cn/s/blog_4bf737b20100096f.html
這里有詳細的說明：
function $(id){
return document.getElementByIdx(id);
}
去掉X

  回復  更多評論