1

私は非常に基本的なコーダーなので、これは非常に基本的な質問です:)

HTML5 のドラッグ アンド ドロップ機能を使用しています。

（同じウィンドウで）URLを開く瞬間まではすべて問題ありません...画像はドラッグ可能で、ドラッグアンドドロップは正常に機能します。しかし...

別の要素内にドロップされた要素に関連付けられた URL をブラウザーで開くにはどうすればよいですか? また、その URL をその要素に関連付けるにはどうすればよいですか?

より明確にするために。ホームページには画像ギャラリーがあります。各画像に異なる URL を関連付ける必要があります (単に ID に入れるだけですか?)。ギャラリーのすぐ下にボックスがあります。このボックスに画像をドラッグ アンド ドロップすると、ブラウザは特定のリンクを開く必要があります。

ありがとうございました！

ジョバンニ

4

2 に答える 2

1

次のように、リンクをデータに配置し、ドロップ イベントでロードします。

<!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 に答える