1

我有一个使用 JavaScript 的带有 JSP 的 Maven Jetty 项目。我希望能够突出显示与拖动图像的大小相对应的画布部分。

当我通过简单地在浏览器中打开它来查看我的 JSP 时，一切都按预期工作，但是当我以目标 jetty:run 启动 Jetty 服务器时，未设置或无法从事件的 transferData 中检索拖动对象的 ID .

相关代码：所有可拖动的图像都有一个唯一的 ID。在拖动开始时，我在事件的 transferData 上设置拖动图像的 ID，如下所示：

function dragShipFromTable(event) {
    event.dataTransfer.setData("id",event.target.id);
}

当图像被拖到画布上时，我调用以下函数

function allowDrop(event) {
    event.preventDefault();
    var id = event.dataTransfer.getData("id");
    var img = document.getElementById(id);
    // Do the highlighting stuff
    ....
}

问题是，当服务器启动并且我执行上述操作时，在 allowDrop(event) 中，未从 transferData 检索拖动图像的 ID。它是未定义的，因此突出显示失败。当简单地将 JSP 作为文件打开时，情况并非如此。

4

1 回答 1

2

好吧，我找到了自己问题的答案。首先，dataTransfer 对象的 setData 方法只允许某些格式作为第一个参数。我将其解释为关联数组，但事实并非如此。所以应该是

event.dataTransfer.setData("text/plain", id);
event.dataTransfer.getData("text/plain");

正确设置和检索 id。

但最终由于 chrome 导致一切都失败了，因为 Chrome 中存在一个错误，它阻止我按预期使用 dataTransfer （请参阅如何从 Chrome 中的 dragstart 事件中获取所选项目？dataTransfer.getData 是否损坏？）。

我现在使用全局变量来存储我需要的信息。而且我仍然想知道为什么当页面显示为文件而不是作为来自网络服务器的响应时一切正常。

于 2012-05-18T20:20:44.240 回答