jQuery Mobile 断开链接。正确的用法是什么？

问题描述 投票：0回答：2

我将 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 时，它可以正常工作。

我已经看到这个问题 - 添加

data-ajax="false"
似乎确实解决了问题，但这真的有必要吗？那么 jQuery Mobile 的意义何在呢？ 

$.mobile.ajaxEnabled = false
什么也没做。我还在 Github 上遇到了此讨论，并希望该问题仅在链接到非 jQuery Mobile 页面时发生，但事实并非如此。

jquery jquery-mobile hyperlink
2个回答
9
投票

这是 jQuery Mobile 独有的东西。

首先，您错过了一个重要信息，如果您只需要使用一项功能，切勿将 jQuery Mobile 与其他框架混合使用。在这种情况下，您应该自定义 jQuery Mobile 并仅使用/构建所需的功能。在这里找到它。

在您的情况下，您正在使用完整的 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 框架，永远不要。

如果您需要更多信息，请随时询问我。

0
投票

同样的问题，我以为是浏览器错误。谢谢

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.