使用jQuery UI Touch Punch时，jQuery 3.3下Draggable功能失效求助

你遇到的Uncaught TypeError: e(...).find(...).andSelf is not a function错误，本质是jQuery 3.x彻底移除了andSelf()方法，而你当前使用的jQuery UI 1.9.2版本还在依赖这个旧API，导致库之间的兼容性冲突。andSelf()在jQuery 1.8+就被标记为废弃，3.x直接移除，取而代之的是addBack()方法，但旧版jQuery UI没做这个适配。

下面给你两个可行的修复方案，根据你的实际需求选择：

方案一：升级jQuery UI到兼容jQuery 3.x的版本（推荐） #

这是最稳妥、长期维护性更好的方案。jQuery UI 1.12.x分支是官方支持jQuery 3.x的稳定版本，同时Touch Punch 0.2.3也能适配这个版本的jQuery UI。

你只需要替换测试代码中的脚本引用部分，注意加载顺序必须是jQuery在前，然后是jQuery UI，最后是Touch Punch：

<!-- 先引入jQuery 3.3.1 -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous" type="text/javascript" charset="utf-8"></script>
<!-- 替换为兼容jQuery 3.x的jQuery UI 1.12.1 -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
<!-- 保留Touch Punch（0.2.3版本适配新版jQuery UI） -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

替换后你的完整测试代码就能正常运行，不管桌面端还是iOS移动端的拖拽功能都会恢复。

方案二：手动添加API兼容补丁（不升级jQuery UI的临时方案） #

如果因为项目依赖限制不能升级jQuery UI，可以在加载jQuery之后、jQuery UI之前，添加一段小补丁，把andSelf()映射到新版的addBack()：

<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous" type="text/javascript" charset="utf-8"></script>
<!-- 添加兼容补丁 -->
<script>
if (!jQuery.fn.andSelf) {
    jQuery.fn.andSelf = jQuery.fn.addBack;
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

这个补丁会让旧版jQuery UI调用andSelf()时，实际执行addBack()，从而绕过兼容性错误。不过这只是临时 workaround，长期来看还是建议升级到官方支持的版本，避免后续出现其他潜在问题。

验证要点 #

• 确认脚本加载顺序没有颠倒，否则会出现"jQuery is not defined"之类的错误。
• 测试iOS移动端的触摸拖拽功能，确保Touch Punch和新版库配合正常。

内容的提问来源于stack exchange，提问作者hder