例をひっぱる

1242 ワード

function allowDrop(ev) { console.log("ondragover",ev) ev.preventDefault(); } function drag(ev,str) { console.log("start drag",str,ev) ev.dataTransfer.setData("Text",ev.target.id); } function drop(ev) { console.log("drop",ev) ev.preventDefault(); var data=ev.dataTransfer.getData("Text"); ev.target.appendChild(document.getElementById(data)); }

div :



関連知識

  • draggable=「true」で、構成プロパティは
  • ドラッグできます.
  • ドラッグターゲットでイベントをトリガーする
  • ondragstart-ユーザーが要素のドラッグを開始すると
  • がトリガーされます.
  • ondrag-要素がドラッグ中に
  • がトリガーされます.
  • ondragend-ユーザーが要素のドラッグを完了すると
  • がトリガーされます.
  • ターゲットの解放時にトリガーされるイベント:
  • ondragenter-マウスでドラッグするオブジェクトがコンテナの範囲内に入ると、このイベント
  • がトリガーされます.
  • ondragover-ドラッグするオブジェクトが別のオブジェクトコンテナ範囲内でドラッグすると、このイベント
  • がトリガーされます.
  • ondragleave-マウスでドラッグするオブジェクトがコンテナの範囲から離れると、このイベント
  • がトリガーされます.
  • ondrop-ドラッグ中にマウスボタンを離すと、このイベント
  • がトリガーされます.