                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /鼠標拖拽效果

請問我想實現(xiàn)這樣一個功能左右可以互相拖拽，我現(xiàn)在只做了左邊的部分，哪里出錯了？

HTML部分

<!DOCTYPE html>
<html>
??? <head>
??????? <meta charset = "UTF-8">
??????? <title>task0002</title>
??????? <link rel = "stylesheet" type = "text/css" href = "css/task002_5.css">
??? </head>
??? <body>
??????? <div id = "leftBox">
??????????? <div id = "box1" class = "box">1</div>
??????????? <div id = "box2" class = "box">2</div>
??????????? <div id = "box3" class = "box">3</div>
??????????? <div id = "box4" class = "box">4</div>
??????? </div>
??????? <div id = "rightBox">
??????????? <div id = "box5" class = "box">5</div>
??????????? <div id = "box6" class = "box">6</div>
??????????? <div id = "box7" class = "box">7</div>
??????????? <div id = "box8" class = "box">8</div>
??????? </div>
??? </body>
??????? <script type="text/javascript" src="js/util.js"></script>
??????? <script type="text/javascript" src="js/task002_5.js"></script>
</html>

JS部分：

?window.onload=drag;
?var box = $("#leftBox").getElementsByClassName("box");
function drag(){
?? ?for(var i = 0;i<box.length;i++){
??????? box[i].onmousedown=fndown;
??????? box[i].onmouseup=function(event){
?????? ??? ?event = event || window.event;
?????? ??? ?var le = $("#rightBox").getElementsByTagName("div");
?????? ??? ?if((130<parseInt(event.clientX -disX))&&(parseInt(event.clientX -disX)<460)&&(event.clientY -disY<$("#rightBox").offsetTop)){
?? ???????????? this.parentNode.removeChild(this);
?? ???????????? this.style.left=0+'px';
??????????????? this.style.top=(le.length)*30+'px';
?? ???????????? $("#rightBox").appendChild(this);
??????????? } else{
??????????????????? this.style.left=0+'px';
??????????????????? this.style.top=0+'px';
??????????? }
?????? ??? ?document.onmousemove = null;
?????? ??? ?document.onmouseup = null;
??????? }
??? }
}
function fndown(event){
?? ?event = event || window.event;
??? var target = event.target || event.srcElement;
?? ?disX=event.clientX-target.offsetLeft,
??? disY=event.clientY-target.offsetTop;
??? document.onmousemove=function(event){
??????? event = event || window.event;
??????? var target = event.target || event.srcElement;
?? ??? ?target.style.left=event.clientX -disX + "px";
?? ???? target.style.top=event.clientY -disY + "px";
??? }
}