javascript中的拖放

我试图用javascript实现拖放功能。我几乎已经完成了这项工作，但当触发

mousemove

事件时，问题就出现了。元素不在指针的位置。我做了很多尝试，但都没有成功。这是你的电话号码。我在这里也提到了我的代码结构：

HTML:

拖动项目未正确设置其位置。这是你的电话号码

---

还有一件事。。。如果我想在

mouseup

事件中检查鼠标目标是否为

pillers

类，应该是什么条件。

mousedown事件函数中未正确声明元素的位置；它们总是零，在上面

因为这些值是元素的声明起始坐标，所以在鼠标向下移动时，元素会转到屏幕的左上角（0,0）

上述elmX和elmY部分可替换为以下内容：

elmX = $(this).offset().left;
elmY = $(this).offset().top;

这使得开始坐标成为鼠标向下时的实际开始位置

---

这一变化对我来说是有效的，在Chrome中。更新的。

如果使用JQuery UI可拖动功能，您的生活会轻松得多！你应该看看我的手机，我知道。。但我想用JS或max JQury来做。看看这个小提琴@rafaeldefazio我错过了什么。。我会非常感激的。

var mouseX = 0,
    mouseY = 0,
    elmX   = 0,
    elmY   = 0,
    tempZ  = 0,
    currentElm;

$(document).on('mousedown', '.dragable', function(e){
  var temp;
  $(this).addClass('abs');

  mouseX = e.clientX;
  mouseY = e.clientY;

  temp = +($(this).css('left'));
  //temp = $(this).offset().left;
  elmX = null || isNaN(temp) ? 0 : temp;

  temp = +($(this).css('top'));
  //temp = $(this).offset().top
  elmY = null || isNaN(temp) ? 0 : temp;

  $(this).css({'z-index':'9999'});

  currentElm = $(this);

  document.body.focus();
  // prevent text selection in IE
  document.onselectstart = function () { return false; }; 

  // prevent IE from trying to drag an image 
  $(this).ondragstart = function() { return false; }; 

  // prevent text selection (except IE) 
  return false;
}).mouseup('.dragable', function(e){
  if(currentElm !== null){
    currentElm.css({'z-index' : '1'});
    currentElm = null;
  }
}).mousemove('.dragable', function(e){
  if(currentElm !== null){
    currentElm.css({
      left : (elmX + e.clientX - mouseX)+'px',
      top : (elmY + e.clientY - mouseY)+'px'
    });
  }
});

elmX = $(this).offset().left;
elmY = $(this).offset().top;