JavaScriptでマウスイベント（mousedown、mousemoveイベント）を使用してドラッグイベントをシミュレートするには

Question

JavaScriptでマウスイベント（mousedown、mousemoveイベント）を使用してドラッグイベントをシミュレートするにはどうすればよいですか？私はドラッグイベントをプログラム的に作成し、マウスイベントを引き起こしたいと思います。

Answer 1

DragEventインターフェイスは、ドラッグアンドドロップ操作を表すDOMイベントです。 このインターフェイスは、MouseEventおよびイベント のプロパティを継承します（詳細はhereを参照してください）。 mouseEventsは、ポインティングデバイス（通常はマウス）がリスナーが接続されている要素の上を移動すると発生します。あなたは外部ライブラリを使用することができますhere

Answer 2

// add mousedown handler  
document.addEventListener('mousedown', handleMousedown); 

function handleMousedown() { 
    // on mousedown add listeners 
    document.addEventListener('mouseup', handleMouseup); 
    document.addEventListener('mousemove', handleMousemove); 
} 

function handleMousemove(event) { 
    // let's make some magic 
} 

function handleMouseup() { 
    // on mouseup remove listeners 
    document.removeEventListener('mouseup', handleMouseup); 
    document.removeEventListener('mousemove', handleMousemove); 
} 

jsfiddle example