1

这是一个非常基本的问题，因为我是一个非常基本的编码员:)

我正在使用 HTML5 中的拖放功能

一切都很好，直到打开 URL（在同一个窗口中）的那一刻......图像是可拖动的，拖放工作正常。但...

如何让浏览器打开与放置在另一个元素中的元素关联的 URL，以及如何将该 URL 关联到该元素？

要更清楚。在主页中，我有一个图片库。对于每个图像，我需要关联一个不同的 url（我只是把它放在 id 中吗？）。就在画廊下面有一个盒子。当我在此框中拖放图像时，浏览器需要打开特定链接。

谢谢！

乔瓦尼

4

2 回答 2

1

将您的链接放在您的数据上并将其加载到 drop 事件中，如下所示：

<!DOCTYPE HTML>
<html>
    <head>
        <style type="text/css">
            #div1, #div2
            {float:left; width:100px; height:35px; margin:10px;padding:10px;border:1px solid #aaaaaa;}
        </style>
    <script>
        function allowDrop(ev)
        {
            ev.preventDefault();
        }

        function drag(ev)
        {
            ev.dataTransfer.setData("Url","http://www.google.fr");
        }

        function drop(ev)
        {
            ev.preventDefault();
            window.location=ev.dataTransfer.getData("Url");
        }
    </script>
    </head>
    <body>
        <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
         <img src="img_w3slogo.gif" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"></div>
        <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    </body>
</html>
于 2013-01-24T11:23:17.783 回答
0

将 event.preventDefault() 放入拖放函数或所有拖放函数中

function drop(e)
{
    e.preventDefault();
    // Code...
}
于 2020-09-18T11:31:50.200 回答