dragstart中的event.preventDefault（）爲什麼會中斷正在執行的拖動事件？

Question

我試圖拖動圖像，併爲了停止瀏覽器的默認圖像拖動，我使用event.preventDefault（）。但由於某種原因，它正在中斷進一步的事件，如dragenter，dragover，dragend等等。爲什麼會這樣以及如何在不中斷正常拖動事件的情況下停止瀏覽器的默認功能。

<img src="/img/image1" id="img1"/> 

jQuery的

var obj=$('#ironman'); 
obj.on('dragstart', function (e) { 
     //e.preventDefault(); 
     console.log("dragstart"); 
    }); 

    obj.on('dragenter', function (e) { 
     console.log("dragenter"); 
    }); 

    obj.on('dragover', function() { 
     console.log("dragover"); 
    }); 
    obj.on('dragleave', function() { 
     console.log("dragleave"); 
    }); 

    obj.on('dragend', function() { 
     console.log("dragend"); 
    }); 

JSfiddle

Answer 1

這是一個艱難的一個，你是在元素上停止原生拖鏈事件。不知道爲什麼你想這樣做，但實現本地拖動的一種方法是取消它並處理鼠標事件

var obj=$('#ironman'); 
obj.on('mousedown', function (e) { 
    console.log("mousedown"); 
    // bind to the mousemove event 
    obj.on('mousemove', function (e) { 
     console.log("mousemove"); 
    }); 
}); 

obj.on('mouseup', function (e) { 
    console.log("mouseup"); 
    // unbind the mousemove event 
    obj.unbind('mousemove'); 
}); 
obj.on('dragstart', function (e) { 
    e.preventDefault(); // cancel the native drag event chain 
    console.log("dragstart"); 
});