[解決済み] タッチデバイスでのJavascriptのドラッグ＆ドロップ [終了しました]。

質問

タッチデバイスで動作するdrag & DROPプラグインを探しています。

と同じような機能が欲しいです。 jQuery UI プラグイン と同じような機能が欲しいです。

は jqtouch プラグイン はドラッグをサポートしますが、ドロップはできません。

ここで は、iPhone/iPadのみに対応したドラッグ＆ドロップです。

どなたか、android/ios で動作するドラッグ & ドロッププラグインを紹介していただけませんか？

...または、ドロップ可能なjqtouchプラグインを更新することが可能かもしれません、それはすでにAndriodとIOS上で動作しています。

ありがとうございます。

どのように解決するのですか？

マウスイベントをタッチに変換するライブラリを追加することで、ドラッグ＆ドロップ用の Jquery UI を使用することができます。 https://github.com/furf/jquery-ui-touch-punch このライブラリを使用すると、Jquery UI からのドラッグ アンド ドロップがタッチ デバイスで動作するようになります。

または、私が使っているこのコードを使うこともできます。これはマウスイベントをタッチに変換し、魔法のように動作します。

function touchHandler(event) {
    var touch = event.changedTouches[0];

    var simulatedEvent = document.createEvent("MouseEvent");
        simulatedEvent.initMouseEvent({
        touchstart: "mousedown",
        touchmove: "mousemove",
        touchend: "mouseup"
    }[event.type], true, true, window, 1,
        touch.screenX, touch.screenY,
        touch.clientX, touch.clientY, false,
        false, false, false, 0, null);

    touch.target.dispatchEvent(simulatedEvent);
    event.preventDefault();
}

function init() {
    document.addEventListener("touchstart", touchHandler, true);
    document.addEventListener("touchmove", touchHandler, true);
    document.addEventListener("touchend", touchHandler, true);
    document.addEventListener("touchcancel", touchHandler, true);
}

そして、document.readyの中でinit()関数を呼び出すだけです。

から見つかったコード ここで