这个站点上有一些问题和其他类似的问题,但没有一个适用于我在 Phonegap 2.9、jQuery 2.0.3 和 jQM 1.3.2 上的实现。
普遍的共识是,您需要结合 jQuery UI 和一个名为 jQuery UI Touch Punch 的小型库来“欺骗”jQuery UI 的鼠标事件来处理触摸事件。您可以在此博客上看到这种方法:http: //forresst.github.io/2012/06/22/Make-a-list-jQuery-Mobile-sortable-by-drag-and-drop/。基本上,您只需包含 jQuery UI 和 Touch Punch 库并使用以下语法:
<script>
$(document).bind('pageinit', function() {
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
<!-- Refresh list to the end of sort to have a correct display -->
$( "#sortable" ).bind( "sortstop", function(event, ui) {
$('#sortable').listview('refresh');
});
});
</script>
但是,唉,当我在 Phonegap Build 应用程序中使用它时,这不起作用。我可以清楚地拖放 listview <li>
,但 listview 永远不会刷新以实际完成拖放。令人抓狂的部分是http://forresst.github.io/demos/sortable/en/index.html上有一个演示,它在我的测试移动浏览器上运行良好。所有这些,但是当嵌入到Phonegap中时它就不起作用了。
我通过反复试验发现,如果页面上有一个 RESET 按钮,当我按下 RESET 按钮时,listview 项目就会卡入到位。因此,从逻辑上讲,我尝试通过.click();
调用来模拟这一点,但这些都没有奏效。我已经搜索了互联网,并尽我所能跟踪 phonegap 应用程序中的堆栈跟踪,但我还没有找到解决方案。此外,我希望不必将 jQuery UI 合并到我的 jQuery Mobile 应用程序中。
有没有人找到适用于当前版本的 Phonegap 和 jQuery Mobile 的有效解决方案,供用户拖放可排序列表?