【问题标题】:HTML drag and drop in IE9IE9中的HTML拖放
【发布时间】:2012-08-03 11:46:49
【问题描述】:
我尝试在 HTML 中拖放。它在除 IE9 之外的所有浏览器中运行良好(无需在低于 IE9 的环境下运行)。 IE9 中不会触发 ondrop 事件。
有什么帮助吗?这是我的代码。
jsFiddle
提前致谢。
【问题讨论】:
-
-
@CodeJack,我已经看过了。没有公认的解决方案。我尝试按照那里的建议将
-
标签:
javascript
html
internet-explorer
drag-and-drop
【解决方案1】:
如果您将 div 替换为 a 标记,它将起作用。但是,您还应该进行一些其他更改,首先通过在onclick 事件中返回false 来确保a 标记不是可点击的链接:
<a class="div123" href="#" draggable="true"
ondragstart="handleDragStart(event)"
ondrop="handleDrop(event)"
ondragover="dragoveHandler(event)"
onclick="return false;">
HTML5 drag and drop
</a>
其次,IE9 不接受setData 中text/plain 的参数,请改用Text 或在try...catch 中添加数据。此外,您应该确保您添加的数据实际上是文本:
e.dataTransfer.setData("Text", "" + $(e.target).index());
最后,您的handleDrop 函数需要preventDefault/return false,否则删除链接(a 元素`)的默认操作是导航到删除的 URL:
function handleDrop(e) {
alert($(e.target).index());
if (e.preventDefault) {
e.preventDefault(); // Necessary. Stops redirect.
}
return false;
}
Here is a jsFiddle of your code which will work in IE9.