拖拽

建立函数

function DragBox(boxId) {
    if (boxId == undefined) {
        return;
    }
    this.ele = document.getElementById(boxId);
    var self = this;
    this.ele.onmousedown = function(e) {
        self.detaX = e.clientX - self.ele.offsetLeft;
        self.detaY = e.clientY - self.ele.offsetTop;
        self.start();
        document.onmouseup = function() {
            self.stop();
        }
    }
}```
##方法

```DragBox.prototype.start = function() {
    var self = this;
    document.onmousemove = function(e) {
        var x = e.clientX - self.detaX;
        var y = e.clientY - self.detaY;

        self.move(x, y)
    }
}
DragBox.prototype.move = function(x, y) {
    var self = this;
    self.ele.style.left = x + "px";
    self.ele.style.top = y + "px";
}
DragBox.prototype.stop = function() {
    document.onmousemove = null;
}```
##继承
```function DragBoxText(r){
            DragBox.call(this,r)
        }
        DragBoxText.prototype=new DragBox
        DragBoxText.prototype.move=function (x,y){
            DragBoxText.prototype.move.call(this,x,y)
            this.ele.innerHTML=x+","+y
        }```

你可能感兴趣的:(拖拽)