0

我正在使用以下函数通过句柄拖动 div：

function enableDragging(ele) {
    var dragging = dragging || false,
        x, y, Ox, Oy,
        current;
        enableDragging.z = enableDragging.z || 1;
    var grabber = document.getElementById("myHandelDiv");
    grabber.onmousedown = function(ev) {
        current = ev.target.parentNode;
        dragging = true;
        x = ev.clientX;
        y = ev.clientY;
        Ox = current.offsetLeft;
        Oy = current.offsetTop;
        current.style.zIndex = ++enableDragging.z;
        console.log(dragging);

        window.onmousemove = function(ev) {
            pauseEvent(ev);         
            if (dragging == true) {
                var Sx = ev.clientX - x + Ox,
                    Sy = ev.clientY - y + Oy;
                current.style.top = Sy + "px";
                current.style.left = Sx + "px";
                document.body.focus();
                // prevent text selection in IE
                document.onselectstart = function () { return false; };
                // prevent IE from trying to drag an image
                ev.ondragstart = function() { return false; };                  
                return false;   
            }
        };
        window.onmouseup = function(ev) {
            dragging && (dragging = false);
        }
    };
}    

function pauseEvent(e){
    if(e.stopPropagation) e.stopPropagation();
    if(e.preventDefault) e.preventDefault();
    e.cancelBubble=true;
    e.returnValue=false;
    return false;
}

我有两个问题：

  1. 在 IE 7 和 8 中不起作用，由于某种原因，我没有收到任何错误。
  2. 拖动时在某些浏览器上选择了文本，导致拖动出现滞后

我像这样启动拖动：

var ele = document.getElementById("divDragWrapper");
enableDragging(ele);

更新，我现在在 IE 中收到此错误：

SCRIPT5007：无法获取属性“目标”的值：对象为空或未定义

在这一行： current = ev.target.parentNode;

4

1 回答 1

0

您需要添加ev = ev || window.event到所有事件处理函数。较旧的 IE 不会在参数中传递事件对象。在那些浏览器中也是target如此。srcElement

例如：

grabber.onmousedown = function(ev) {
    ev = ev || window.event;
    var target = ev.target || ev.srcElement;
    current = target.parentNode;
        ...
}

另一件事是，较旧的 IE 无法附加onmousemove到window. 您可以使用documentordocument.body代替。

请参阅jsFiddle的实际代码。

于 2013-02-10T17:58:20.197 回答