我将 jQuery Mobile 添加到我的项目中，因为我希望滑动事件触发 Bootstrap 轮播滚动。用它编码一天左右后，我注意到内部链接不再起作用。 我可以使用以下两个页面 test1.html 可靠地重现此内容:
<html>
<head></head>
<body>
<a href="test2.html">Another page</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.js">
</script>
</body>
</html>
和test2.html:
<html>
<head></head>
<body>
<a href="test1.html">First page</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.js">
</script>
</body>
</html>
当我单击链接时，jQuery 代码将抛出一个已处理的异常，该异常被吞下，但目标页面永远不会在浏览器中加载。当我删除 jQuery Mobile 时，它可以正常工作。
我见过this question - 添加 data-ajax="false" 似乎确实解决了问题，但这真的有必要吗？那么 jQuery Mobile 的意义何在呢？
$.mobile.ajaxEnabled = false 没有执行任何操作。我还遇到过this discussion在 Github 上，并希望该问题仅在链接到非 jQuery Mobile 页面时发生，但事实并非如此。
最佳答案
这是 jQuery Mobile 独有的东西。
首先，您错过了一个重要信息，如果您只需要使用一项功能，切勿将 jQuery Mobile 与其他框架混合使用。在这种情况下，您应该自定义 jQuery Mobile 并仅使用/构建所需的功能。找到它here .
在您的情况下，您正在使用完整的 jQuery Mobile 框架，它将超越您的整个项目。 jQuery Mobile 使用 AJAX 来处理页面管理，这意味着它会将页面加载到 DOM 中，以使它们尽可能流畅地运行。
使用多个 HTML 模板时，只有第一个 HTML 文件会完全加载到 DOM 中。当您打开另一个页面时，jQuery Mobile 将剥离 HEAD 并仅加载具有 data-role="page" 属性的 div，因为您没有此类 div 页面转换将失败.
当您禁用 AJAX 加载 data-ajax="false" 属性时，您将强制 jQuery Mobile 使用经典页面处理。
基本上只需遵循我的第一个建议并仅使用您真正需要的功能重建 jQuery Mobile。仅当您打算将其用作 UI 框架而不是其他框架时，才使用完整的 jQuery Mobile 框架，永远不要。
如果您需要更多信息，请随时询问我。
关于jQuery Mobile 断开链接。正确的使用方法是什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23816523/