今天闲来没事写一个简单的面向对象的拖拽，然后在运用继承方法做一个限制大小的拖拽，好下面先写一个面向对象的拖拽。

divclass{width:100px;height:100px;background:#ccc}

     
      me
     

function Drag(id){    var _this = this;    this.oDiv=document.getElementById(id);    this.oDiv.οnmοusedοwn=function(ev){      _this.fnDown(ev);      return false;    }};Drag.prototype.fnDown = function(ev){    var _this = this;    var oEvent=ev||event;    this.disX=oEvent.clientX-this.oDiv.offsetLeft;    this.disY=oEvent.clientY-this.oDiv.offsetTop    document.onmousemove=function(ev){      _this.fnMove(ev);    }    document.onmouseup=function(){      _this.fnUp();    }};Drag.prototype.fnMove = function(ev){    var oEvent=ev||event;    this.oDiv.style.left=oEvent.clientX-this.disX+"px";    this.oDiv.style.top=oEvent.clientY-this.disY+"px";};Drag.prototype.fnUp = function(){    document.onmousemove=document.οnmοuseup=null;};

下边是继承 首先新建一个FuDrag()类  新增一个方法

function FuDrag(id){  Drag.call(this,id);//构造函数}for(i in Drag.prototype){  FuDrag.prototype[i] = Drag.prototype[i];//不同于引用，只改变了子集的}FuDrag.prototype.fnMove =function(ev){    var oEvent=ev||event;    l=oEvent.clientX-this.disX;    t=oEvent.clientY-this.disY;    if(l < 0){      l = 0;    }else if(l > document.documentElement.clientWidth-this.oDiv.offsetWidth){      l= document.documentElement.clientWidth-this.oDiv.offsetWidth;    };        if(t <0){      t = 0;    }else if(t > document.documentElement.clientHeight-this.oDiv.offsetHeight){      t= document.documentElement.clientHeight-this.oDiv.offsetHeight    };    this.oDiv.style.left=l+"px";    this.oDiv.style.top=t+"px";  }

然后后在测试一下，我们定义两个div  分别创建不同的对象

window.onload = function(){  new Drag('div1');  new FuDrag('div2')}