制作一个jQuery Mobile listview可按Drag& amp;放入Phonegap

时间:2013-09-25 22:34:07

标签: jquery-mobile cordova draggable jquery-ui-sortable

本网站上有一些问题,其他问题与此相似,但我的实现在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永远不会刷新以实际完成drop。令人抓狂的部分是http://forresst.github.io/demos/sortable/en/index.html的演示版在我的测试移动浏览器上完美运行。所有这些,但它嵌入到Phonegap中时不起作用。

我通过反复试验发现,如果页面上有一个RESET按钮,当我按下RESET按钮时,listview项目就会卡入到位。所以,从逻辑上讲,我试图通过.click();调用来模拟这个,但那些没有用。我搜索了互联网,并尽力遵循phonegap应用程序中的堆栈跟踪,但我还没有找到解决方案。此外,我不想将jQuery UI整合到我的jQuery Mobile应用程序中。

有没有人找到适用于当前版本的Phonegap和jQuery Mobile的工作解决方案,以便用户拖放可排序列表?

1 个答案:

答案 0 :(得分:0)

我发现,一般来说,在构建Cordova / Phonegap环境时减少对jquery可排序功能的依赖是花费时间的。使用https://rubaxa.github.io/Sortable /

对移动应用中的html表格元素进行排序效果很好