有谁知道为什么以下网站拖放示例（以及许多其他在线教程）在 Internet Explorer 9 中不起作用？ Chrome、FireFox 和 Safari 都可以。
http://www.html5rocks.com/tutorials/dnd/basics/
我认为 IE9 应该是最符合 HTML5 的浏览器？尤其是 DnD，因为他们从 IE5 开始就一直支持它。我必须在某处更改设置吗？
我使用 HTML5 和 CSS3 的次数越多……IE9 越缺乏。
谁有任何可以在 IE9 中使用的 DnD 教程的链接？
【问题讨论】：
标签： html drag-and-drop internet-explorer-9
我找到了一种解决方法，可以让原生 dnd api 也可以在 IE 中使用链接和图像以外的元素。为可拖动容器添加 onmousemove 处理程序，并在按下按钮时调用原生 IE 函数 element.dragDrop()：
function handleDragMouseMove(e) {
var target = e.target;
if (window.event.button === 1) {
target.dragDrop();
}
}
var container = document.getElementById('widget');
if (container.dragDrop) {
$(container).bind('mousemove', handleDragMouseMove);
}
// todo: add dragstart, dragover,... event handlers
【讨论】：
$(container).bind('selectstart', function(){this.dragDrop(); return false;});
document.on("selectstart", "[draggable]", function(event, element) { event.stop(); element.dragDrop(); }); - 所有[draggable] 元素的一个全局事件观察者
$(container).on('selectstart', function(){this.dragDrop(); return false;}); 似乎不再需要用于放置、拖动等的特定于浏览器的代码。并且它不会对忽略 IE9 特定代码的 Chrome、Firefox 和 IE10+ 造成任何额外的问题。
dragDrop 在 Chrome 和其他浏览器中未定义。如果现在将其包装在if (this.dragDrop) {} 中。
好吧，我在 IE9 中也遇到过这种奇怪的行为，似乎 IE9 不会在 div 上进行拖放（HTML 5 样式）。如果您将使用 href="#" 更改 A 的 div，您将能够拖放。
这不会拖拽：
<div data-value="1" class="loadedmodule-container" draggable="true">drag</div>
这将：
<a href="#" data-value="1" class="loadedmodule-container" draggable="true">drag</a>
希望这对任何人都有帮助
【讨论】：
div 元素进行拖放。问题是它在display: block; 元素上没有正确执行。
我也遇到了同样的问题。这个技巧对我有用：
node.addEventListener('selectstart', function(evt) {
this.dragDrop();
return false;
}, false);
它停止选择并开始拖动。
【讨论】：
This DnD example 在 IE9 中工作。
我认为the example from HTML5Rocks 不能在 IE9 中工作，因为 CSS3 的特性。该示例使用了几个 CSS3 功能，但 IE9 的 CSS3 支持并不好。
此外，一些 JS 事件和方法在 IE 中不起作用。例如setDragImage() 即使在 IE9 中也无法工作。这也是原因之一。
【讨论】：
我也一直在看这个，我发现 Opera 11.50 也有同样的基本问题；它和 IE9 都不理解 HTML5 的可拖动属性，也不理解 HTML5 的拖放事件。
作为一种解决方法，我确实在http://dev.opera.com/articles/view/accessible-drag-and-drop/ 找到了这篇歌剧文章，该文章模拟了对 mousedown、mouseover、mousemove、mouseout 和 mouseup 事件的拖放支持。当然，这是很多工作，但它确实为您提供了 Opera 中的 dnd 支持。
您可以在http://devfiles.myopera.com/articles/735/example.html观看现场演示
相同的 dnd 模拟技巧适用于 IE9，并且看起来与其他 HTML5 浏览器兼容。
【讨论】：
这对我有用。就拖放而言，它使 IE9 的行为与其他现代浏览器一样：
if (document.doctype && navigator.appVersion.indexOf("MSIE 9") > -1) {
document.addEventListener('selectstart', function (e) {
for (var el = e.target; el; el = el.parentNode) {
if (el.attributes && el.attributes['draggable']) {
e.preventDefault();
e.stopImmediatePropagation();
el.dragDrop();
return false;
}
}
});
}
【讨论】：
我遇到了与上述 Didier Caron 相同的问题。可拖动的divs 不起作用，但锚标签可以正常工作。我在HTML5 Doctor 找到了解决方案。
【讨论】：
我建议使用jQuery UI's draggable。
【讨论】：
使用默认设置为 true 的可拖动属性的元素。他们和 它应该工作 干杯
【讨论】：