0

DnD要素のこのコードがあります。特定の要素に対して機能します。ただし、すべての div で機能するようにしたいと考えています。move関数に「this.id」を参照できません。私はそれを機能させるために欠けているものはありません。

window.addEventListener('load', init, false);
function init(){

      //just one element
   /* box = document.getElementById('div1');
    box.addEventListener('mousedown', startMoving, false);
    box.addEventListener('mouseup', stopMoving, false);*/

     //all element?
    box = document.getElementsByTagName('div');
    for (i=0;i<box.length;i++) {
        box[i].addEventListener('mousedown', startMoving, false);
        box[i].addEventListener('mouseup', stopMoving, false);
    }

}

 function startMoving(evt){
   evt = evt || window.event;
   var posX = evt.clientX, 
   posY = evt.clientY,
   a = document.getElementById(this.id);
   divTop = parseInt(a.style.top),
   divLeft = parseInt(a.style.left); 
   var diffX = posX - divLeft, 
   diffY = posY - divTop; 

   document.onmousemove = function(evt){ 
    evt = evt || window.event;
    var posX = evt.clientX, 
    posY = evt.clientY, 
    aX = posX - diffX, 
    aY = posY - diffY;
    move(this.id,aX,aY); 
        }
    }
function stopMoving(){ 
 document.onmousemove = function(){}
 }

  function move(divid,newX,newY){
    var a = document.getElementById(divid);
    a.style.left = newX + 'px';
    a.style.top = newY + 'px';
    }

これを作るより良い方法はありますか?

4

0 に答える 0