散分：发个DIV拖拽，请各位老师指点。。。

Question

<script type="text/javascript">
var Class = {
//创建类
create: function () {
return function () {
this.initialize.apply(this, arguments);
};
}
};var $A = function (a) {
//转换数组
return a ? Array.apply(null, a) : new Array;
};var $ = function (id) {
//获取对象
return document.getElementById(id);
};Object.extend = function (a, b) {
//追加方法
for (var i in b) a[i] = b[i];
return a;
};Object.extend(Object, { addEvent : function (a, b, c, d) {
//添加函数
if (a.attachEvent) a.attachEvent(b[0], c);
else a.addEventListener(b[1] || b[0].replace(/^on/, ""), c, d || false);
return c;
},

delEvent : function (a, b, c, d) {
if (a.detachEvent) a.detachEvent(b[0], c);
else a.removeEventListener(b[1] || b[0].replace(/^on/, ""), c, d || false);
return c;
},

reEvent : function () {
//获取Event
return window.event ? window.event : (function (o) {
do {
o = o.caller;
} while (o && !/^\[object[ A-Za-z]*Event\]$/.test(o.arguments[0]));
return o.arguments[0];
})(this.reEvent);
}

});Function.prototype.bind = function () {
//绑定事件
var wc = this, a = $A(arguments), o = a.shift();
return function () {
wc.apply(o, a.concat($A(arguments)));
};
};
var Table = Class.create();Table.prototype = { initialize : function () {
//初始化
var wc = this;
wc.cols = new Array; //创建列
},

addCols : function (o) {
//添加列
var wc = this, cols = wc.cols, i = cols.length;
return cols[i] = {
id : i, div : o, rows : new Array, //创建行
addRow : wc.addRow, chRow : wc.chRow, inRow : wc.inRow, delRow : wc.delRow
};
},

addRow : function (o) {
//添加行
var wc = this, rows = wc.rows, i = rows.length;
return rows[i] = {
id : i, div : o, cols : wc
};
},

inRow : function (a, b) {
//插入行
var wc = b.cols = this, rows = wc.rows, i;
if (a < rows.length) {
for (i = a ; i < rows.length ; i ++) rows[i].id ++;
rows.splice(a, 0, b);
b.id = a;
return b;
} else {
b.id = rows.length;
return rows[b.id] = b;
}
},

delRow : function (a) {
//删除列
var wc = this, rows = wc.rows, i, r;
if (a >= rows.length) return;
r = rows[a];
rows.splice(a, 1);
for (i = a ; i < rows.length ; i ++) rows[i].id = i;
return r;
}
};

Answer 1

var CDrag = Class.create();CDrag.IE = /MSIE/.test(window.navigator.userAgent);CDrag.prototype = {

initialize : function () {
//初始化成员
var wc = this;
wc.table = new Table; //建立表格对象
wc.iFunc = wc.eFunc = null;
wc.obj = { on : { a : null, b : "" }, row : null, left : 0, top : 0 };
wc.temp = { row : null, div : document.createElement("div") };
wc.temp.div.setAttribute(CDrag.IE ? "className" : "class", "CDrag_temp_div");
wc.temp.div.innerHTML = "&nbsp;";
},

reMouse : function (a) {
//获取鼠标位置
var e = Object.reEvent();
return {
x : document.documentElement.scrollLeft + e.clientX,
y : document.documentElement.scrollTop + e.clientY
};
},

rePosition : function (o) {
//获取元素绝对位置
var $x = $y = 0;
do {
$x += o.offsetLeft;
$y += o.offsetTop;
} while ((o = o.offsetParent) && o.tagName != "BODY");
return { x : $x, y : $y };
},

sMove : function (o) {
//当拖动开始时设置参数

var wc = this;
if (wc.iFunc || wc.eFinc) return;

var mouse = wc.reMouse(), obj = wc.obj, temp = wc.temp, div = o.div, position = wc.rePosition(div);

obj.row = o;
obj.on.b = "me";
obj.left = mouse.x - position.x;
obj.top = mouse.y - position.y;

temp.row = document.body.appendChild(div.cloneNode(true)); //复制预拖拽对象

with (temp.row.style) {
//设置复制对象
position = "absolute";
left = mouse.x - obj.left + "px";
top = mouse.y - obj.top + "px";
zIndex = 100;
opacity = "0.3";
filter = "alpha(opacity:30)";
}

with (temp.div.style) {
//设置站位对象
height = div.clientHeight + "px";
width = div.clientWidth + "px";
}


/*div.parentNode.insertBefore(temp.div, div);
div.style.display = "none"; //隐藏预拖拽对象*/
div.parentNode.replaceChild(temp.div, div);

wc.iFunc = Object.addEvent(document, ["onmousemove"], wc.iMove.bind(wc));
wc.eFunc = Object.addEvent(document, ["onmouseup"], wc.eMove.bind(wc));
document.onselectstart = new Function("return false");
},

iMove : function () {
//当鼠标移动时设置参数
var wc = this, cols = wc.table.cols, mouse = wc.reMouse(), obj = wc.obj, temp = wc.temp, row = obj.row, div = temp.row,
t_position, t_cols, t_rows, i, j;

with (div.style) {
left = mouse.x - obj.left + "px";
top = mouse.y - obj.top + "px";
}

for (i = 0 ; i < cols.length ; i ++) {
t_cols = cols[i];
t_position = wc.rePosition(t_cols.div);
if (t_position.x < mouse.x && t_position.x + t_cols.div.offsetWidth > mouse.x) {
if (t_cols.rows.length > 0) { //如果此列行数大于0
if (wc.rePosition(t_cols.rows[0].div).y + 20 > mouse.y) {
//如果鼠标位置大于第一行的位置即是最上。。
//向上
obj.on.a = t_cols.rows[0];
obj.on.b = "up";
obj.on.a.div.parentNode.insertBefore(temp.div, obj.on.a.div);
} else if (t_cols.rows.length > 1 && t_cols.rows[0] == row &&
wc.rePosition(t_cols.rows[1].div).y + 20 > mouse.y) {
//如果第一行是拖拽对象而第鼠标大于第二行位置则，没有动。。
//向上
obj.on.b = "me";
t_cols.rows[1].div.parentNode.insertBefore(temp.div, t_cols.rows[1].div);
} else {
for (j = t_cols.rows.length - 1 ; j > -1 ; j --) {
//重最下行向上查询
t_rows = t_cols.rows[j];
if (t_rows == obj.row) continue;
if (wc.rePosition(t_rows.div).y < mouse.y) {
//如果鼠标大于这行则在这行下面
if (t_rows.id + 1 < t_cols.rows.length && t_cols.rows[t_rows.id + 1] != obj.row) {
//如果这行有下一行则重这行下一行的上面插入
t_cols.rows[t_rows.id + 1].div.parentNode.
insertBefore(temp.div, t_cols.rows[t_rows.id + 1].div);
obj.on.a = t_rows;
obj.on.b = "down";
} else if (t_rows.id + 2 < t_cols.rows.length) {
//如果这行下一行是拖拽对象则插入到下两行，即拖拽对象返回原位
t_cols.rows[t_rows.id + 2].div.parentNode.
insertBefore(temp.div, t_cols.rows[t_rows.id + 2].div);
obj.on.b = "me";
} else {
//前面都没有满足则放在最低行
t_rows.div.parentNode.appendChild(temp.div);
obj.on.a = t_rows;
obj.on.b = "down";
}
return;
}
}
}
} else {
//此列无内容添加新行
t_cols.div.appendChild(temp.div);
obj.on.a = t_cols;
obj.on.b = "new";
}
}
}
},

eMove : function () {
//当鼠标释放时设置参数
var wc = this, obj = wc.obj, temp = wc.temp, row = obj.row, div = row.div, o_cols, n_cols;

if (obj.on.b == "up") {
//向最上添加
o_cols = obj.row.cols;
n_cols = obj.on.a.cols;
n_cols.inRow(0, o_cols.delRow(obj.row.id));
} else if (obj.on.b == "down") {
//相对向下添加
o_cols = obj.row.cols;
n_cols = obj.on.a.cols;
n_cols.inRow(obj.on.a.id + 1, o_cols.delRow(obj.row.id));
} else if (obj.on.b == "new") {
//向无内容列添加
o_cols = obj.row.cols;
n_cols = obj.on.a;
n_cols.inRow(0, o_cols.delRow(obj.row.id));
}

temp.div.parentNode.replaceChild(div, temp.div);
temp.row.parentNode.removeChild(temp.row);
delete temp.row;

Object.delEvent(document, ["onmousemove"], wc.iFunc);
Object.delEvent(document, ["onmouseup"], wc.eFunc);
document.onselectstart = wc.iFunc = wc.eFunc = null;
},

add : function (o) {
//添加对象
var wc = this;
Object.addEvent(o.div.childNodes[CDrag.IE ? 0 : 1], ["onmousedown"], wc.sMove.bind(wc, o));
},

parse : function (o) {
//初始化成员
var wc = this, table = wc.table, cols, i, j;
for (i = 0 ; i < o.length ; i ++) {
cols = table.addCols(o[i].cols);
for (j = 0 ; j < o[i].rows.length ; j ++)
wc.add(cols.addRow(o[i].rows[j]));
}
}

};Object.addEvent(window, ["onload"], function () {
var wc = new CDrag;
wc.parse([

{
cols : $("m_1"), rows : [$("m_1_1"), $("m_1_2"), $("m_1_3"), $("m_1_4")]
},

{
cols : $("m_2"), rows : [$("m_2_1"), $("m_2_2"), $("m_2_3"), $("m_2_4")]
},

{
cols : $("m_3"), rows : [$("m_3_1"), $("m_3_2"), $("m_3_3"), $("m_3_4")]
},

{
cols : $("m_4"), rows : [$("m_4_1"), $("m_4_2"), $("m_4_3"), $("m_4_4")]
}

]);
});</script>
</head>

Answer 2

<body>
<br />
<div class="root">
<div class="cell" id="m_1">
<div class="line">第一列</div>
<div class="move" id="m_1_1">
<div class="title">第一列的第一个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_1_2">
<div class="title">第一列的第二个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_1_3">
<div class="title">第一列的第三个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_1_4">
<div class="title">第一列的第四个的说</div>
<div class="content"></div>
</div>
</div>

<div class="cell r_nbsp">&nbsp;</div>

<div class="cell" id="m_2">
<div class="line">第二列</div>
<div class="move" id="m_2_1">
<div class="title">第二列的第一个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_2_2">
<div class="title">第二列的第二个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_2_3">
<div class="title">第二列的第三个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_2_4">
<div class="title">第二列的第四个的说</div>
<div class="content"></div>
</div>
</div>

<div class="cell r_nbsp">&nbsp;</div>

<div class="cell" id="m_3">
<div class="line">第三列</div>
<div class="move" id="m_3_1">
<div class="title">第三列的第一个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_3_2">
<div class="title">第三列的第二个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_3_3">
<div class="title">第三列的第三个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_3_4">
<div class="title">第三列的第四个的说</div>
<div class="content"></div>
</div>
</div>

<div class="cell r_nbsp">&nbsp;</div>

<div class="cell" id="m_4">
<div class="line">第四列</div>
<div class="move" id="m_4_1">
<div class="title">第四列的第一个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_4_2">
<div class="title">第四列的第二个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_4_3">
<div class="title">第四列的第三个的说</div>
<div class="content"></div>
</div>
<div class="move" id="m_4_4">
<div class="title">第四列的第四个的说</div>
<div class="content"></div>
</div>
</div>
</div>
</body>
</html>

Answer 3

MARK
很不错的东西
保存了

Answer 4

以上Code贴到一起存成HTML即可测试
测试地址：http://www.zhb.org.cn/wc/cdrag/

Answer 5

无聊着,这两天都不知道写了啥,,,灌一下... function AddNewItem(sMainId, sSubTag, sItemNumMkrStart, sItemNumMkrEnd)
 {
  var Debug = false;
  var oMain = document.getElementById(sMainId);
  if(oMain==null)
  {
   alert("无法获得 Main 对象!");
   return;
  } // end if
  
  var oSubList = oMain.getElementsByTagName(sSubTag);
  if(oSubList.length==0)
  {
   alert("获取子对象集合出错!");
   return;
  } // end if
  
  if(Debug)
  {
   alert("oSubList.length: "+oSubList.length);
   alert("typeof(oSubList[oSubList.Length-1]): "+typeof(oSubList[oSubList.length-1]));
   alert("oSubList[oSubList.length-1].tagName: "+oSubList[oSubList.length-1].tagName);
  }
  
  var tempNode = document.createElement(sSubTag);
  var tempNodeText = oSubList[oSubList.length-1].innerHTML;
  
  if(sItemNumMkrStart!=null&&sItemNumMkrEnd!=null)
  {
   if(Debug)
   {
    alert(" text ok");
   }
   var re = new RegExp("[^<>\\d]*([\\d]+)[\\s]*"+sItemNumMkrEnd, "i");
   tempNodeText=tempNodeText.replace
   (
   re
   ,
   function($1,$2)
   {
    $2 = $2.replace(/^\s+|\s+$/gi, "");
    $2 = $2-0+1;
    
    var sFinal = $2+sItemNumMkrEnd;
    return sFinal;
   }
   );
  }
  tempNode.innerHTML=tempNodeText;
  var tempTextNode = document.createTextNode("\r\n");
  
  oMain.appendChild(tempNode);
  oMain.appendChild(tempTextNode);
 } // end function AddNewItem function SetCompOrPrs(oRdo, sForDsabId)
 {
  var Debug = false;
  var oTemp = document.getElementById(sForDsabId);
  
  if(oTemp==null)
  {
    alert("目标对象为空！");
    return;
  }
  
  switch(oRdo.value)
  {
    case "0":
     oTemp.value = "非公司";
     oTemp.disabled = true;
     break;
     
    default:
     oTemp.value = "请输入贵公司名称";
     oTemp.disabled = false;
     break;
  }
  
  if(Debug)
  {
    alert("SetCompOrPrs Ok");
  }
  
 } // end function SetCompOrPrs

Answer 6

/*-----------------------------------------------------------------------------------*\
  * shawl.qiu SubmitCheck 类 v1.0
 \*-----------------------------------------------------------------------------------*/
 //---------------------------------begin class SubmitCheck()-------------------------------//
 function SubmitCheck()
 { // shawl.qiu code
  //------------------------------------begin public variable
  //---------------begin about
  this.auSubject = 'shawl.qiu SubmitCheck 类 v1.0';
  this.auVersion = 'v1.0';
  this.au = 'shawl.qiu';
  this.auEmail = '[email protected]';
  this.auBlog = 'http://blog.csdn.net/btbtd';
  this.auCreateDate = '2007-4-26';
  //---------------end about
  this.Debug = true;
  
  this.Form = function(){};
  this.Form.ID = "OrderForm";
  
  this.RdoSleNoEmptyItem = "opcompanyRdo:1::opcompanyname";
  this.NotEmptyItem = ""; // a|b|c
  this.IsEmail = ""; // a|b|c
  
  this.ListItemMainId = "TempDl";
  this.ListItemTag = "div";
  
  this.NotEmptyListItem = ""; // a|b|c
  this.IsNumberNameRange = ""; // a|b|c
  
  this.MatchLength = ""; // name:len|name:len
  
  this.IsVerify = "";
  
  this.Go = fGo;
  //------------------------------------end public variable
  
  //------------------------------------begin private variable
  var Tl = this;
  var bValidate = false;
  var oForm;
  //------------------------------------end private variable
  
  //------------------------------------begin public method
  //------------------------------------end public method
  
  //------------------------------------begin private method
  function fGo()
  { 
   var debug = true;
   oForm = document.getElementById(Tl.Form.ID);
   
   if(oForm==null)
   {
    alert("无法获得 Form 对象!");
    return;
   } // end if
   
   oForm.onsubmit = fSubmit;
   oForm.onreset = fReset;
   
  } // end function fGo();
  
  function fSubmit()
  {
   var bSubmit = confirm("现在提交表单吗?");
   if(!bSubmit) return false;
   
   fTrimForm(this);
   
   // start RdoSleNoEmptyItem
   //  "opcompanyRdo:1::opcompanyname"
   var RdoSleNoEmptyItemRge = Tl.RdoSleNoEmptyItem.split("|");
   for(var i=0; i<RdoSleNoEmptyItemRge.length; i++)
   {
    var ItemRge = RdoSleNoEmptyItemRge[i].split("::");
    var ItemFthRge = ItemRge[0].split(":");
    
    if(this[ItemFthRge[0]][0].checked)
    {
     var ItemForCkRge = ItemRge[1].split(":");
     for(var j=0; j<ItemForCkRge.length; j++)
     {
      this[ItemForCkRge[j]].value = fStrTrim(this[ItemForCkRge[j]].value);
      if(fStrTrim(this[ItemForCkRge[j]].value)=="")
      {
       alert("不能为空的项!");
       this[ItemForCkRge[j]].focus();
       return false;
      }
     }
    }
   } // end if
   // end RdoSleNoEmptyItem
   
   // start Tl.NotEmptyItem 
   var NotEmptyItemRge = Tl.NotEmptyItem.split("|");
   for(var i = 0; i < NotEmptyItemRge.length; i++)
   {
    this[NotEmptyItemRge[i]].value = fStrTrim(this[NotEmptyItemRge[i]].value);
    if(this[NotEmptyItemRge[i]].value=="")
    {
     alert("不能为空的项!");
     this[NotEmptyItemRge[i]].focus();
     return false;
    }
   }
   // end Tl.NotEmptyItem
   
   IsEmailRge = Tl.IsEmail.split("|");
   for(var i=0; i<IsEmailRge.length; i++)
   {
    if(fIsEmail(this[IsEmailRge[i]].value)==false)
    {
      alert("请输入正确的电子邮件地址!");
      this[IsEmailRge[i]].focus();
      return false;
    } // end if
   } // end for
   
   var MatchLengthRge = Tl.MatchLength.split("|");
   for(var i=0; i<MatchLengthRge.length; i++)
   {
    var ItemRge = MatchLengthRge[i].split(":");
    if(ItemRge.length!=2)
    {
      alert("集合 ItemRge 出错!");
    }
    
    var oItem = this[ItemRge[0]];
    var iValue = ItemRge[1]-0;
    
    if(oItem.value.length!=iValue)
    {
     alert("长度不匹配的项!");
     oItem.focus();
     return false;
    }
   }
   
   var ListItemMain = document.getElementById(Tl.ListItemMainId);
   if(ListItemMain==null)
   {
    alert("列表主域出错!");
    return false;
   }
   
   var ListItemTagRge = ListItemMain.getElementsByTagName(Tl.ListItemTag);
   if(ListItemTagRge.length==0)
   {
     alert("列表项出错!");
     return false;
   }
   
   for(var i=0; i<ListItemTagRge.length; i++)
   {
    //alert(this["oname"][i].value);
    var NotEmptyListItemRge = Tl.NotEmptyListItem.split("|");
    try
    {          
     var bEmpty = true;
     for(var j=0; j<NotEmptyListItemRge.length; j++)
     {
      NotEmptyListItemRge[j] = fStrTrim(NotEmptyListItemRge[j]);
 
      if(fStrTrim(this[NotEmptyListItemRge[j]][i].value)!="")
      {
        bEmpty = false;
      } // end if
     } // end for 1
    
     if(bEmpty)
     {
      ListItemTagRge[i].parentNode.removeChild(ListItemTagRge[i]);
      --i;
     } // end if
    }
    catch(e)
    {
     
    } // end try
   } // end for
   
   if(ListItemTagRge.length==0)
   {
    alert("操作出错, 没有可以提交的项!");
    return false;
   }
   
   for(var i=0; i<ListItemTagRge.length; i++)
   {
    //alert(this["oname"][i].value);
    var NotEmptyListItemRge = Tl.NotEmptyListItem.split("|");
    try
    {          
     for(var j=0; j<NotEmptyListItemRge.length; j++)
     {
      NotEmptyListItemRge[j] = fStrTrim(NotEmptyListItemRge[j]);
      this[NotEmptyListItemRge[j]][i].value = fStrTrim(this[NotEmptyListItemRge[j]][i].value);
      if(fStrTrim(this[NotEmptyListItemRge[j]][i].value)=="")
      {
        alert("不能为空的项!");
        this[NotEmptyListItemRge[j]][i].focus();
        return false;
      } // end if
     } // end for 1
    }
    catch(e)
    {
     
    } // end try
   } // end for
   
   var IsNumberNameRangeRge = document.getElementsByName(Tl.IsNumberNameRange);
   
   for(var i = 0; i < IsNumberNameRangeRge.length; i++)
   {
    if(!fIsNumber(IsNumberNameRangeRge[i].value))
    {
     alert("项必须为数字!");
     IsNumberNameRangeRge[i].focus();
     return false;
    } // end if
   } // end for
   
   
   if(Tl.IsVerify!="")
   {
    this[Tl.IsVerify].value = "true";
   }
   
   return true;
  } // end function fSubmit
  
  function fReset()
  {
    return confirm("现在重置内容吗?");
  }
  
 function fStrTrim(sStr){
  return sStr.replace(/^\s+|\s+$/g,'');
 } // shawl.qiu code
 
 function fIsEmail(sIpt)
 {
  return /@/.test(sIpt);
 }
 
 function fIsNumber(sIpt)
 {
  return /^[\d.]+$/.test(sIpt);
 }
 
 function fTrimForm(oForm)
 {
  for(var i=0; i<oForm.length; i++)
  {
   if(oForm[i].type=="text"||oForm[i].type=="textarea")
   {
    oForm[i].value = fStrTrim(oForm[i].value);
   } // end if
  } // end for
  function fStrTrim(sStr){
   return sStr.replace(/^\s+|\s+$/g,'');
  } // shawl.qiu code
 } // end function fTrimForm
  //------------------------------------end private method
 } // shawl.qiu code
 //---------------------------------end class SubmitCheck()---------------------------------//

Answer 7

//拖动函数
function drag(elementToDrag, event) {
    event = event || window.event;
    var startX = event.clientX, startY = event.clientY;
    var origX = elementToDrag.offsetLeft, origY = elementToDrag.offsetTop;
    var deltaX = startX - origX, deltaY = startY - origY;
    if (document.addEventListener) {
        document.addEventListener("mousemove", moveHandler, true);
        document.addEventListener("mouseup", upHandler, true);
    }
    else if (document.attachEvent) {
        elementToDrag.setCapture( );
        elementToDrag.attachEvent("onmousemove", moveHandler);
        elementToDrag.attachEvent("onmouseup", upHandler);
        elementToDrag.attachEvent("onlosecapture", upHandler);
    }
    else {
        var oldmovehandler = document.onmousemove;
        var olduphandler = document.onmouseup;
        document.onmousemove = moveHandler;
        document.onmouseup = upHandler;
    }
    if (event.stopPropagation) event.stopPropagation( );
    else event.cancelBubble = true;
    if (event.preventDefault) event.preventDefault( );
    else event.returnValue = false;    function moveHandler(e) {
        if (!e) e = window.event;
        elementToDrag.style.left = (e.clientX - deltaX) + "px";
        elementToDrag.style.top = (e.clientY - deltaY) + "px";
        if (e.stopPropagation) e.stopPropagation( );
        else e.cancelBubble = true;
    }
    function upHandler(e) {
        if (!e) e = window.event;
        if (document.removeEventListener) {
            document.removeEventListener("mouseup", upHandler, true);
            document.removeEventListener("mousemove", moveHandler, true);
        }
        else if (document.detachEvent) {
            elementToDrag.detachEvent("onlosecapture", upHandler);
            elementToDrag.detachEvent("onmouseup", upHandler);
            elementToDrag.detachEvent("onmousemove", moveHandler);
            elementToDrag.releaseCapture( );
        }
        else {
            document.onmouseup = olduphandler;
            document.onmousemove = oldmovehandler;
        }
        if (e.stopPropagation) e.stopPropagation( );
        else e.cancelBubble = true;
    }
}
使用方法:
<div onmousedown="drag(this,event)">lasjdlfajsldfjladsjflkjsldkfjla</div>

Answer 8

没什么呀.. 我实在是抓狂呀, 今天浪费了一天....这个目录中的文件...
Folder PATH listing for volume Backup
Volume serial number is 0006EEEC 209C:FFAE
G:.
│  index.txt
│  
├─aboutus
│      default.aspx
│      
├─contact
│      default.aspx
│      
├─feedback
│  │  default.aspx
│  │  
│  └─print
│          default.aspx
│          style.css
│          
├─guestbook
├─ing
│  │  default.aspx
│  │  
│  ├─display
│  │      default.aspx
│  │      
│  └─images
│          dt.jpg
│          
├─order
│  │  default.aspx
│  │  
│  ├─html_template
│  │      order.htm
│  │      print.htm
│  │      
│  ├─js
│  │      js.js
│  │      
│  ├─print
│  │      default.aspx
│  │      style.css
│  │      
│  └─style
│          style.css
│          
├─product
│  │  default.aspx
│  │  
│  ├─ac
│  │      List.ascx
│  │      text.ascx
│  │      
│  ├─cat
│  │      default.aspx
│  │      
│  ├─display
│  │      default.aspx
│  │      
│  ├─html_template
│  │      list.htm
│  │      
│  ├─images
│  │  │  1.jpg
│  │  │  12.jpg
│  │  │  14.jpg
│  │  │  2.jpg
│  │  │  3.jpg
│  │  │  4.jpg
│  │  │  5.jpg
│  │  │  6.jpg
│  │  │  8.jpg
│  │  │  9.jpg
│  │  │  daKeTong.png
│  │  │  daKeTong_1.png
│  │  │  shuZhiJiaoNang.jpg
│  │  │  
│  │  └─thumb
│  │          1.jpg
│  │          12.jpg
│  │          14.jpg
│  │          2.jpg
│  │          3.jpg
│  │          4.jpg
│  │          5.jpg
│  │          6.jpg
│  │          8.jpg
│  │          9.jpg
│  │          daKeTong.png
│  │          daKeTong_1.png
│  │          shuZhiJiaoNang.jpg
│  │          
│  ├─include
│  │      leftCol.aspx
│  │      
│  └─print
│          default.aspx
│          style.css
│          
└─system
    │  default.aspx
    │  
    ├─ac
    │  │  SysBasic.ascx
    │  │  SysConfig.ascx
    │  │  SysFeedback.ascx
    │  │  SysMarking.ascx
    │  │  SysOrder.ascx
    │  │  SysPage.ascx
    │  │  SysProduct.ascx
    │  │  SysUser.ascx
    │  │  
    │  ├─config
    │  │      CfgFeedback.ascx
    │  │      CfgOrder.ascx
    │  │      CfgProduct.ascx
    │  │      
    │  ├─feedback
    │  │      FbConfig.ascx
    │  │      FbDel.ascx
    │  │      FbList.ascx
    │  │      
    │  ├─ing
    │  │      MrkAdd.ascx
    │  │      MrkDel.ascx
    │  │      MrkMain.ascx
    │  │      
    │  ├─order
    │  │      DelOrder.ascx
    │  │      DelOrderItem.ascx
    │  │      OdrConfig.ascx
    │  │      OdrDisplay.ascx
    │  │      OdrList.ascx
    │  │      
    │  └─product
    │      │  Add.ascx
    │      │  cat.ascx
    │      │  PrdConfig.ascx
    │      │  PrdDel.ascx
    │      │  PrdEdit.ascx
    │      │  PrdMain.ascx
    │      │  
    │      ├─ac
    │      │      List.ascx
    │      │      
    │      └─include
    │              leftCol.aspx
    │              
    ├─html_template
    │      addProduct.htm
    │      MarkMain.html
    │      MrkAdd.html
    │      OdrDisplay.html
    │      SysConfig.html
    │      SysFeedback.htm
    │      SysOrder.html
    │      
    ├─include
    │      leftCol.aspx
    │      prdupload.aspx
    │      rightTopCol.aspx
    │      SysFooter.aspx
    │      
    ├─login
    │      default.aspx
    │      
    ├─logout
    │      default.aspx
    │      
    └─style
            style.css
            

Answer 9

好吧, 不过俺是不再上QQ了, 这两天重装了两次系统, 估计是使用QQ的原因...
闪... 借问一下, 谁有 avg anti spyware  的可用版...

Answer 10

貌似 prototype 的说.支持.MARK

Answer 11

接分
http://www.chenjiliang.com/Article/View.aspx?ArticleID=2370&TypeID=31

Answer 12

@.@
这还多啊才300多行JS
只是加Cookie操作的话需要改动大下。。@.@

Answer 13

代码写的真的很不错，可用性、兼容性都做到了。
楼主你可以再做深一步，因为现在这个版本还只是一个DEMO。你可以在每个DIV块里内嵌一个iframe或者一个AJAX可以异步加载其它的资源，加上最大化、最小化、关闭、新建；然后再结合你现在的结果，就是一个非常不错的Explorer了。

Answer 14

忽忽，知道了以后有空就把cookie，新建，关闭，锁定，等功能都加进去。。

Answer 15

忽，在发是二级分类。。
<script type="text/javascript">
var CSelect = new Function("this.initialize.apply(this, Array.apply(null, arguments))");CSelect.prototype = { initialize : function (a, b) {
var wc = this;
wc.array = [];
wc.select = b;
a.onchange = function () {
var me = this;
wc.change.call(wc, me.options[me.selectedIndex].value);
};
},

change : function (a) {
var wc = this, array = wc.array, o = wc.select, i;
o.options.length = 1;
for (i = 0 ; i < array.length ; i ++) {
if (array[i][0].toString() === a)
o.options[o.options.length] = new Option(array[i][2], array[i][1]);
}
},

add : function (a, b, c) {
//a 为大类ID，b为小类ID，c为小类内容
var wc = this, array = wc.array;
array[array.length] = [a, b, c];
}

};
</script><select id="SortId">
<option value="">选择大类</option>
<option value="0">搜索引擎</option>
</select><select id="TypeId">
<option value="" selected="selected">选择小类</option>
</select><script type="text/javascript">
(function () {
var wc = new CSelect(document.getElementById("SortId"), document.getElementById("TypeId"));
//ASP便利这里即可。
wc.add(0, 0, "百度");
wc.add(0, 1, "google");
wc = null;
})();
</script>

Answer 16

BUG：同列拖拽时。。当被拽行小于替换行，这样删除拖拽行的时候整列元素就 - 1了。。
这样就会把被拽行放到替换行下面，而不是上面了。。
所以加一个判断。。修改下Table类的inRow方法。。
inRow : function (a, b) {
//插入行
var cols = b.cols, wc = b.cols = this, rows = wc.rows, i;
if (a < rows.length) {
if (cols == wc && b.id < a) a --;
for (i = a ; i < rows.length ; i ++) rows[i].id ++;
rows.splice(a, 0, b);
b.id = a;
return b;
} else {
b.id = rows.length;
return rows[b.id] = b;
}
},

Answer 17

inRow : function (a, b) {
//插入行
var cols = b.cols, wc = b.cols = this, rows = wc.rows, i;
if (cols == wc && b.id < a) a --;
for (i = a ; i < rows.length ; i ++) rows[i].id ++;
rows.splice(a, 0, b);
b.id = a;
return b;
}
^o^