如何使用单个函数在Javascript中为拖放程序定位多个项目？

Question

我正在构建一个纯 Javascript程序，用于将项目（例如：Divs）从一个地方拖放到另一个地方（同一页面）。我已经编写了应用程序，但方式不太好。我写了一个函数，在onmouseup事件中选择div的id，onmousedown将鼠标放在任何地方。但是，我正在使用相同的功能，并为我正在制作的每个div多次调用它。所以，我正在寻找一种有效的方法，我只需要调用该函数一次就可以使用它来调用多个div进行拖放。

这是我的代码：

HTML：

<div class="container">
    <div id="block1"> </div>
    <div id="block2"> </div>
    <div id="block3"> </div>
    <div id="block4"> </div>
    <div id="block5"> </div>
    <div id="block6"> </div>
    <div id="block7"> </div>
    <div id="block8"> </div>
    <div id="block9"> </div>
</div>

使用Javascript：

window.onload = function() {
   // For Block 1...
    var el = document.getElementById('block1');
    var mover = false, x, y, posx, posy, first = true;
    el.onmousedown = function() {
        mover = true;
    };
    el.onmouseup = function() {
        mover = false;
        first = true;
    };
    el.onmousemove = function(e) {
        if (mover) {
            if (first) {
                x = e.offsetX;
                y = e.offsetY;
                first = false;
            }
            posx = e.pageX - x;
            posy = e.pageY - y;
            this.style.left = posx + 'px';
            this.style.top = posy + 'px';
        }
    };

    // For Block 2...
    var el = document.getElementById('block2');
    var mover = false, x, y, posx, posy, first = true;
    el.onmousedown = function() {
        mover = true;
    };
    el.onmouseup = function() {
        mover = false;
        first = true;
    };
    el.onmousemove = function(e) {
        if (mover) {
            if (first) {
                x = e.offsetX;
                y = e.offsetY;
                first = false;
            }
            posx = e.pageX - x;
            posy = e.pageY - y;
            this.style.left = posx + 'px';
            this.style.top = posy + 'px';
        }
    };
 ....
}