Question

我正在使用jquery UI可排序功能。这在浏览器中工作正常。但是在iPAD这样的触摸设备中却无法正常工作。以下是我正在使用的代码

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>    
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>   
<script src="js/jquery.ui.touch-punch.js"></script> 

<script>
  $(function() {
    $( ".documents" ).sortable();
    $( ".documents" ).disableSelection();
  });

我的HTML是：

        <div id="bodyContainer">
      <ul class="documents">
        <li>1</li>
        <li>2</li>
        <li>3</li>
      </ul>
            </div>

请尽快告诉我解决方案。提前谢谢。

Answer 1

好的，很明显，因为jQuery UI库不包含触摸事件。如果你开发一个jQuery支持的网站，使用jQuery UI功能主义者，一些人不会在触摸启用移动设备。在您的情况下，您使用sortable()方法就是一个很好的例子。

您可以实施一个简单的解决方案。您可以使用 jQuery UI Touch Punch 插件来解决此问题（正如您所使用的那样）。

请确保您的 jquery.ui.touch-punch.js 文件加载与否。我认为如果它正确加载它应该工作。

您也可以清除浏览器缓存。（在iPad设置＆gt; Safari＆gt;清除Cookie和数据）

以下是工作示例：

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>    
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>   
<script src="https://raw.github.com/furf/jquery-ui-touch-punch/master/jquery.ui.touch-punch.min.js"></script> 



<script>
  $(function() {
    $( ".documents" ).sortable();
    $( ".documents" ).disableSelection();
  });
</script>

<div id="bodyContainer">
      <ul class="documents">
        <li>1</li>
        <li>2</li>
        <li>3</li>
      </ul>
</div>

jQuery UI可排序在iPAD中不起作用

1 个答案: