4

我正在使用 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>

请尽快让我知道解决方案。先感谢您。

4

1 回答 1

5

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

您可以实施一个简单的解决方案。您可以使用jQuery UI Touch Punch插件来克服这个问题(如您所用)。

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

您也可以清除浏览器缓存。(在 iPad 设置 > Safari > 清除 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>
于 2013-12-04T09:23:07.237 回答