Question

我有以下拖放代码。它在Firefox上工作正常，但它不适用于IE。

//This function starts the event
function dragStart(ev) {
    ev.dataTransfer.effectAllowed= 'move'; //Makes the element movable
    ev.dataTransfer.setData("Image", ev.target.getAttribute('id')); // Grabs the element by its id
    return true;
}

//Prevents default but does not turn it off
function dragEnter(ev) {
    ev.preventDefault();
    return true;
}

//Turns off the dragover event and prevents default behavior
function dragOver(ev) {
    return false;
}

//This function performs the actual drop
function dragDrop(ev) {
    var oldImgId = ev.dataTransfer.getData("Image"); //The dragged element’s id is set to a variable

    ev.preventDefault();
    moveImg(oldImgId);
}

当我尝试拖动图片时，我从IE中收到了这些错误：

1）

'target' is null or not an object line 71
line 71 refers to: ev.dataTransfer.setData("Image", ev.target.getAttribute('id')); // Grabs the element by its id

2）

Object doesn't support this property or method line 77
line 77 refers to: ev.preventDefault();

Answer 1

IE仅支持Text或URL作为数据，因此'Image'不起作用。尝试

ev.dataTransfer.setData("Text", ev.target.getAttribute('id'));

这是文档： http://msdn.microsoft.com/en-us/library/ms536744(v=vs.85).aspx

Answer 2

您可能想要使用jQuery UI drag＆amp; amp;因为它旨在适用于所有当前的浏览器。 http://jqueryui.com/demos/droppable/

http://jqueryui.com/demos/draggable

拖放代码适用于FireFox，但不适用于IE

2 个答案: