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;
}

私には2つの問題があります：

  1. IE 7＆8では動作しません。何らかの理由でエラーは発生しません。
  2. 一部のブラウザでドラッグ中にテキストが選択されると、ドラッグが遅れて表示されます

私はこのようにドラッグを開始します：

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

更新、IEでこのエラーが発生しています：

SCRIPT5007：プロパティ'target'の値を取得できません：オブジェクトがnullまたは未定義です

この行：current = ev.target.parentNode;

4

1 に答える 1

0

ev = ev || window.eventすべてのeventhander関数に追加する必要があります。古いIEは、引数内でイベントオブジェクトを渡しません。またtarget、むしろsrcElementそれらのブラウザにあります。

例えば：

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

もう1つは、古いIEはに接続できないということonmousemoveですwindow。documentまたはのdocument.body代わりに使用できます。

jsFiddleで動作中のコードを参照してください。

于 2013-02-10T17:58:20.197 に答える