Html 拖放不在IE中工作
我有一个要拖放到SVG画布上的单元列表。你可以看到 通过以下方式为该操作定义和配置单元:Html 拖放不在IE中工作,html,svg,dart,dart-html,Html,Svg,Dart,Dart Html,我有一个要拖放到SVG画布上的单元列表。你可以看到 通过以下方式为该操作定义和配置单元: var units = html.document.querySelectorAll('ul.units li'); units.onDragStart.listen(_onDragStart); units.onDragEnd.listen(_onDragEnd); void _onDragStart(html.MouseEvent e) { _dragSource = e.target as
var units = html.document.querySelectorAll('ul.units li');
units.onDragStart.listen(_onDragStart);
units.onDragEnd.listen(_onDragEnd);
void _onDragStart(html.MouseEvent e) {
_dragSource = e.target as html.LIElement;
_dragSource.classes.add('moving');
e.dataTransfer.effectAllowed = 'move';
if (isFirefox) {
e.dataTransfer.setData('text/plain', 'Required for Firefox!');
}
}
void _onDragEnd(html.MouseEvent e) {
_dragSource.classes.remove('moving');
}
SVG画布具有以下定义:
canvas = html.document.querySelector(canvas_id);
canvas.onDragOver.listen(_onDragOver);
canvas.onDrop.listen(_onDrop);
void _onDragOver(html.MouseEvent e) {
e.preventDefault();
}
void _onDrop(html.MouseEvent e) {
e.preventDefault();
html.Element dropTarget = e.target;
if (dropTarget == canvas && _dragSource != null && _dragSource.classes.contains('moving')) {
String operatorId = 'operator_${opNumber}';
var mouseCoordinates = getRelativeMouseCoordinates(e);
operators[operatorId] = addOperator(operatorId, _dragSource.dataset['unit-type'], mouseCoordinates['x'], mouseCoordinates['y']);
opNumber += 1;
}
}
这适用于除IE和Safari以外的所有浏览器。问题是我甚至没有收到任何错误或异常消息。你们有什么想法吗?IE11及更高版本不支持SVG元素的HTML5拖放。我做了一个简单的测试,你可以用它在不同的浏览器上测试
如果您想支持SVG元素的拖放,就需要进行手动命中测试。如果你感兴趣,你可以看看。它是我的一个库,支持SVG上的跨浏览器拖放。文档是不存在的,但是您可以查看示例和测试,了解如何使用它。您尝试过这个库吗
它有助于使用dnd,而不必担心每个特定浏览器的实现。在某种程度上,您的回答似乎是合理的。但是,我试图在
上拖动
元素。
支持拖放。是否尝试将元素拖放到
或
?它是
元素。