急～任何使用js实现托拽功能，请教高手

搞个DIV层，让鼠标的事件在那个上面响应就可以了。现在较忙，没有时间给你源码了。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

问题是如何定位
如果想把第三行的移到第二行呢谢谢kingbox731()
你看什么时候有时间
麻烦发个源码给我看下
谢谢或者直接发到邮箱[email protected]
刚学JS时写的，就当抛砖引玉：
<style>
#mm,li{list-style:none;cursor:default;height:30px;width:350px;line-height:30px;border-top:1px solid #eeeeee;}
.SelectedMovedCss{display:none;/*background:#BFFB93;*/}
.SelectedCss{background:#D7FB93;}
.PickBoxOverCss{padding:2px;background-color:#FF9900;}
.PickBoxOutCss{padding:2px;}
.span1{background-image: url(icon_1.gif);width:13px;background-repeat: no-repeat;height:15px;margin-right:1px;overflow:hidden;padding-left:13px;}
.ListDefaultCss{}
.ListDownCss{/*visibility: hidden;*/}
</style>
<BODY ><br><br><br>属于无聊时的作品~<br><br><br><br><br>
<table width="100%">
<tr>
<td>

<ol>
<li id="1" onselectstart="return false" onmousedown="m_down(this)" >1拖动对象     拖动对象拖动对象拖动对象</li>
<li id="2" onselectstart="return false" onmousedown="m_down(this)" >2拖动对象     拖动对象拖动对象拖动对象</li>
<li id="3" onselectstart="return false" onmousedown="m_down(this)" >3拖动对象     拖动对象拖动对象拖动对象</li>
<li id="4" onselectstart="return false" onmousedown="m_down(this)" >4拖动对象     拖动对象拖动对象拖动对象</li>
<li id="5" onselectstart="return false" onmousedown="m_down(this)" >5拖动对象     拖动对象拖动对象拖动对象</li>
<li id="6" onselectstart="return false" onmousedown="m_down(this)" >6拖动对象     拖动对象拖动对象拖动对象</li>
</ol>

</td>
<td>

<ol>
<li id="7" onselectstart="return false" onmousedown="m_down(this)" >7拖动对象     拖动对象拖动对象拖动对象</li>
<li id="8" onselectstart="return false" onmousedown="m_down(this)" >8拖动对象     拖动对象拖动对象拖动对象</li>
<li id="9" onselectstart="return false" onmousedown="m_down(this)" >9拖动对象     拖动对象拖动对象拖动对象</li>
<li id="10" onselectstart="return false" onmousedown="m_down(this)" >10拖动对象     拖动对象拖动对象拖动对象</li>
<li id="11" onselectstart="return false" onmousedown="m_down(this)" >11拖动对象     拖动对象拖动对象拖动对象</li>
<li id="12" onselectstart="return false" onmousedown="m_down(this)" >12拖动对象     拖动对象拖动对象拖动对象</li>
</ol>

</td>
</tr>
</table>
<input type="button" value="ClickHere" onclick="try{alert($('PickBox0').childNodes[0].title);}catch(e){}"/>
<table>
<tr>
<td>

<form name="sub" method="post" onsubmit="SubThis()" action="?">

</form>
<div id="PickBox0" class="PickBoxOutCss" style="overflow:auto;border:1px solid #66CC00;width:30px;height:100px;"></div>
</td>
</tr>
</table>
<input type="button" value="ClickHere" onclick="alert(ResultObj['PickBox1'])"/>
<table>
<tr>
<td>

<form name="sub" method="post" onsubmit="SubThis()" action="?">

</form>
<div id="PickBox1" class="PickBoxOutCss" style="overflow:auto;border:1px solid #66CC00;width:30px;height:100px;"></div>
</td>
</tr>
</table>
</BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
var currentMoveObj = null;    //当前拖动对象
var PickBoxId=new Array;//拖放何处ID组
PickBoxId[0]="PickBox0";
PickBoxId[1]="PickBox1";
var MoveDivId="mm";
var PickBoxObj=new Array;
var relLeft;    //鼠标按下位置相对对象位置
var relTop;
var SelectObj=null;//当前所选
var Result=new Array;
var ResultObj=new Object();
for (var i=0;i<PickBoxId.length; i++)
{
Result[i]=new Array;
ResultObj[PickBoxId[i]]=Result[i];
}
var AllOk=true;
var IsClearSelect=false;//是否移动后清除所选(既是否允许复选,false允许)
var ListDefaultCss="ListDefaultCss";//列表默认CSS
var SelectedCss="SelectedCss";//选择后的列表对象CSS
var PickBoxOverCss="PickBoxOverCss";//盒子在鼠标移入时的CSS
var PickBoxOutCss="PickBoxOutCss";//盒子在鼠标移出时的CSS
var ListDownCss="ListDownCss";//列表按下后的CSS
window.document.onmouseup = function()
{if(currentMoveObj != null){
接上：
//判断是否盒内for (var i=0;i<PickBoxObj.length;i++ )
{
if ((event.x>getSelectPosition(PickBoxObj[i])[0]-document.body.scrollLeft && event.x<(getSelectPosition(PickBoxObj[i])[0]-document.body.scrollLeft+PickBoxObj[i].clientWidth)) && (event.y>getSelectPosition(PickBoxObj[i])[1]-document.body.scrollTop && event.y<(getSelectPosition(PickBoxObj[i])[1]-document.body.scrollTop+PickBoxObj[i].clientHeight)))
{
if(SelectObj != null && SelectObj.parentNode!=PickBoxObj[i]){
Result[i][Result[i].length]=SelectObj.cloneNode(1);
PickBoxObj[i].innerHTML+="<span isBox=\"true\" class=\"span1\" title=\""+SelectObj.innerHTML+"\" id=\""+SelectObj.id+"\" onselectstart=\"return false\" onmousedown=\"m_down(this)\" >"+SelectObj.innerHTML+"</span>";
AllOk=false;
//alert(SelectObj.id);
if(SelectObj.isBox=="true"){var ids=SelectObj.parentNode.id;ResultObj[ids]=ArrayRemove(ResultObj[ids],SelectObj);SelectObj.parentNode.removeChild(SelectObj);
}
dispose(true);
}//已拖动完成到盒内
}
else{
if (SelectObj.parentNode==PickBoxObj[i])
{
if(SelectObj.isBox=="true"){var ids=SelectObj.parentNode.id;ResultObj[ids]=ArrayRemove(ResultObj[ids],SelectObj);SelectObj.parentNode.removeChild(SelectObj);}
}
dispose(false);}//未拖动完成到盒内
}}
}
function f_move()
{    if(currentMoveObj != null)
{
        currentMoveObj.style.pixelLeft=event.x-relLeft;
        currentMoveObj.style.pixelTop=event.y-relTop;
    }
}function m_down(obj){
if (window.event.button!=1)
{return false;
}
for (var i=0;i<PickBoxId.length; i++){PickBoxObj[i]= $(PickBoxId[i]);}
if(SelectObj != null){if(SelectObj.isBox=="true"){SelectObj.style.border="0px solid #FFFFFF";}else{SelectObj.className=ListDefaultCss;}}
SelectObj =obj;//赋新对象
if(SelectObj != null && (SelectObj.isBox=="" || SelectObj.isBox==null)){SelectObj.className =ListDownCss;}//列表按下后
currentMoveObj = $(MoveDivId);
currentMoveObj.innerHTML = obj.innerHTML;
relLeft = event.x - getSelectPosition(obj)[0];
relLeft=SelectObj.isBox=="true" ? relLeft + SelectObj.parentNode.scrollLeft : relLeft ;
relTop = event.y - getSelectPosition(obj)[1];
relTop=SelectObj.isBox=="true" ? relTop + SelectObj.parentNode.scrollTop : relTop ;with(currentMoveObj.style){
display="block";
    position = "absolute";
filter="Alpha(Opacity=50)";
cursor="move";
background="#BFFB93";
pixelLeft=event.x-relLeft+2;
    pixelTop=event.y-relTop + 2;
}
}
function dispose(ok){
if (ok){
if (SelectObj != null ){if(IsClearSelect){SelectObj.parentNode.removeChild(SelectObj);}}
}//拖动完成
if (SelectObj != null ){if(SelectObj.isBox=="true"){SelectObj.style.border="1px solid #FF9900";}else{SelectObj.className=SelectedCss;}}
if(currentMoveObj != null){
currentMoveObj.style.display="none";
currentMoveObj = null;
}
for (var i=0;i<PickBoxObj.length;i++ ){PickBoxObj[i].className=PickBoxOutCss;}
}
function getSelectPosition(obj) {
        var objLeft = obj.offsetLeft;
        var objTop = obj.offsetTop;
        var objParent = obj.offsetParent;
        while (objParent.tagName != "BODY") {
                objLeft += objParent.offsetLeft;
                objTop += objParent.offsetTop;
                objParent = objParent.offsetParent;
        }
        return([objLeft,objTop]);
}function $(){return document.getElementById(arguments[0]);}document.onmousemove=function(){
if(currentMoveObj != null){
f_move();
//判断然后是否盒内
for (var i=0;i<PickBoxObj.length;i++ )
{if ((event.x>getSelectPosition(PickBoxObj[i])[0]-document.body.scrollLeft && event.x<(getSelectPosition(PickBoxObj[i])[0]-document.body.scrollLeft+PickBoxObj[i].clientWidth)) && (event.y>getSelectPosition(PickBoxObj[i])[1]-document.body.scrollTop && event.y<(getSelectPosition(PickBoxObj[i])[1]-document.body.scrollTop+PickBoxObj[i].clientHeight)) && SelectObj.parentNode!=PickBoxObj[i])
{
PickBoxObj[i].className=PickBoxOverCss;//移入盒内
}
else{
PickBoxObj[i].className=PickBoxOutCss;//在盒外
}}
}}function ArrayRemove(ArrayObj,obj){
if(ArrayObj==null)return null;
var po=-1;
for (var i=0;i<ArrayObj.length;i++)
{
if (ArrayObj[i].id==obj.id)
{po=i;
}
}
if (po!=-1)
{
for (var i=po;i<ArrayObj.length;i++)
{
if (i!=ArrayObj.length-1){ArrayObj[i]=ArrayObj[i+1]}
}
ArrayObj.length=ArrayObj.length-1
}
return ArrayObj;
}window.onbeforeunload=checkSave;function  checkSave()
{
if (!AllOk)
{
window.event.returnValue = '你的相关操作尚未保存!';
}
}document.writeln('<div id="mm" onselectstart="return false" style="display:none;z-index:99999"   onmousemove="f_move(this)"></div>');
/*var el = e.target ? e.target : e.srcElement;
/*document.oncontextmenu=function(){
if (event.srcElement==SelectObj){
//alert("d");
return false;
}}*/
//window.onerror=function(){return false;}
function SubThis(){return false;}
//-->
</SCRIPT>
可以参考
http://community.csdn.net/Expert/TopicView1.asp?id=5574016
多选等修改下即可