我正在尝试使用 Dynatree 插件实现拖放功能。 它在IE 9中完全按预期工作。 但是，在Chrome中，该功能是间歇性的。 我已经从Dynatree网站下载了最新的.js文件，并且还使用了我引用的jquery版本.js。
起初，我认为在Chrome中，我声明的onDragOver和onDrop函数根本没有被调用。 但是，当我插入控制台日志语句，然后启动渲染 Dynatree 对象的 MVC 项目时，我可以在 Chrome 开发人员工具控制台监视器中看到 onDragStart 函数总是被调用而不会失败，但是当我使用"附加"节点拖动鼠标时，我只能让 onDragOver 函数在看似随机的位置触发。 当我触发 onDragOver 并实际"引用"或突出显示树中的其他节点之一时，onDrop 函数也可以工作。
具有讽刺意味的是，下面的代码在IE9中完美运行。 我可以让它在Chrome中工作，但前提是我在WebForms ASP.NET 项目中使用它。 现在，我相信你在想，"为什么不在WebForms项目中使用它呢？ 这仍然是一种可能性（最后的手段），但是通过我们需要通过将更改保存到数据库来完成的工作，MVC 将更好地用于站点的其他方面。 下面的代码相当接近于Dynatree主页上提供的示例之一。
感谢您提供的任何帮助。
更新：我发现并不是没有调用onDragOver和onDrop函数。 当使用MVC在Chrome中查看时，dynatree非常挑剔，并且对你点击的确切位置很敏感。 这可能完全是我的json字符串或Chrome上的某些设置的产物。 我只是还不知道。 如果我单击节点的左侧，我可以每次都选择它，并将其移动到我想要的位置。 我必须非常具体地说明我拖放它的位置。 在Chrome中，在Web表单模型中，似乎您可以操作的"区域"要大得多。 ?
$(document).ready(function () {
$("#OrgTree").dynatree({
initAjax: {
url: $('#Path').val()
},
dnd: {
onDragStart: function (node) {
/** This function MUST be defined to enable dragging for the tree.
* Return false to cancel dragging of node.
*/
//alert(node);
logMsg("tree.onDragStart(%o)", node);
return true;
},
onDragOver: function (node, sourceNode, hitMode) {
/** Return false to disallow dropping this node. * */
logMsg("tree.onDragOver(%o, %o, %o)", node, sourceNode, hitMode);
// Prevent dropping a parent below it's own child
if (node.isDescendantOf(sourceNode)) {
return false;
}
// Prohibit creating children in non-folders (only sorting allowed)
//if (!node.data.isFolder && hitMode === "over") { return "after"; }
},
onDrop: function (node, sourceNode, hitMode, ui, draggable) {
/** This function MUST be defined to enable dropping of items on
* the tree.
*/
logMsg("tree.onDrop(%o, %o, %o)", node, sourceNode, hitMode);
if (node.isDescendantOf(sourceNode)) {
return false;
}
//alert(node, sourceNode, hitMode);
//sourceNode.expand();
sourceNode.move(node, hitMode);
},
onDragEnter: function (node, sourceNode) {
/** sourceNode may be null for non-dynatree droppables.
* Return false to disallow dropping on node. In this case
* onDragOver and onDragLeave are not called.
* Return 'over', 'before, or 'after' to force a hitMode.
* Return ['before', 'after'] to restrict available hitModes.
* Any other return value will calc the hitMode from the cursor position.
*/
// Prevent dropping a parent below another parent (only sort
// nodes under the same parent)
// Allowing dropping *over* a node will create a child of that node
if (node.isDescendantOf(sourceNode)) {
return false;
}
return ["before", "after", "over"];
}
}
});
})
我发现问题在于对图标文件的引用和正在使用的旧版本的 jquery 库。 我仍然不确定为什么这不是IE的问题，而是Chrome的问题。
关于为什么对图标文件的错误引用会导致问题的理论是，当 Dynatree 对象上没有渲染图标时，Chrome 不会插入任何要点击的"像素地址"。 我意识到这不是正确的术语，但这是我的理论。 在IE中，这似乎不是问题。
当我在更正对图标文件的引用后呈现页面时，一切都按预期工作。