JavaScript 拖拽实例代码

<script src="js/jquery-1.10.1.min.js">
<script type="text/javascript">
$(function(){
moveBox($("#Box"),$("#drag")) ;
})
//B被拖动的div，BT可拖动区域
function moveBox(B,BT){
var bDrag = false;
var _x,_y;
BT.mousedown(function(event){
var e=event || window.event;
bDrag = true;
_x=e.pageX-B.position().left;
_y=e.pageY-B.position().top;
return false
})
$(document).mousemove(function(event){
if(!bDrag) return false;
var e=event || window.event;
var x=e.pageX-_x;
var y=e.pageY-_y;
console.log(B.position());
var maxL = $(document).width() - B.outerWidth();
var maxT = $(document).height() - B.outerHeight();
x = x < 0 ? 0: x; x = x > maxL ? maxL: x;
y = y < 0 ? 0: y; y = y > maxT ? maxT: y;
B.css({left:x,top:y});
return false
}).mouseup(function(){
bDrag = false;
return false
})
}