jQuery UI draggable兼容移动端

为了使jQuery UI的draggable功能兼容移动端，你需要做的是确保触摸事件被正确处理。以下是一个简单的示例，展示了如何使用jQuery UI的draggable方法创建一个在移动端上可拖拽的元素。

首先，确保你已经包含了jQuery和jQuery UI库：

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

然后，在HTML中添加你想要拖拽的元素：

<div id="draggable">拖动我</div>

最后，使用jQuery来初始化draggable并确保它能够在移动端上工作：

$(function() {
    $("#draggable").draggable({
        scroll: true, // 允许滚动
        addClasses: false, // 不添加额外的类
        refreshPositions: false // 不刷新位置
    });
 
    // 为了确保触摸事件被识别，可能需要添加以下代码
    $(document).on("mousedown", "input[type='text']", function() {
        // 当用户在移动端点击输入框时防止页面滚动
        $(this).blur();
    });
});

这段代码会使得ID为draggable的元素可以在移动端上被拖拽。如果你发现拖拽不是很流畅，可能需要调整一些选项，比如scroll，以适应不同的页面布局。此外，你可能还需要添加一些额外的事件处理代码，以确保在特定情况下（如点击输入框时）的行为是预期的。