JQuery移动如何使用TouchPunch.js在页面上移动元素？

Question

我试图在我正在进行的项目中使用touchPunch黑客，以便动态创建的元素可以在页面上移动。我正在使用网络风暴作为我的IDE，并已经通过了一步一步的教程，如何正确地使用触摸屏。我包括了所需的脚本：

    <script src="http://code.jquery.com/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js"> 
    </script>

    <script src="jquery.ui.touch-punch.min.js"></script>

然后我在屏幕上创建我的div：

    <div id="square" style="width:25px; height:25px; background-color: blue"></div>

然后，在我的jquery中，我有以下代码：

    $("#square").draggable();

问题是拖放功能没有被识别，当我试图通过apk在我的手机上运行phonegap项目时，我的任何元素都不会移动。

Answer 1

我知道这个问题是几个月的old....but，我偶然发现它，并看到它没有答案。

我更新了头中的脚本，并将jQuery封装在文档就绪中，现在它可以工作了。我已经在几个Cordova应用程序中与jQuery ui / jQuery手机一起使用了触屏功能，而且效果很好。不管怎么说，下面很管用。如果您仍然有问题，打开Safari或Chrome，并检查是否有任何错误，您正在得到。祝好运。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<script src="https://raw.githubusercontent.com/furf/jquery-ui-touch-punch/master/jquery.ui.touch-punch.min.js"></script>

$( document ).ready(function() {
    $("#square").draggable();
});

链接到工作代码：