小编典典

如在Javascript中未将其加载到jQuery mobile中的dom中

ajax

我有一个page1.html，其中有这样的链接：

<a href="page2.html">PAGE2</a>

一部分page2.html是这样的：

<html>
<head>
</head>
<body>
<div data-role="page">
</div>
<script src="file1.js"></script>
<script src="file.js"></script>
</body>
</html>

还有这个：

<html>
<head>
</head>
<body>
<div data-role="page">
</div>
<div data-role="page">
<script src="file1.js"></script>
<script src="file.js"></script>
</div>
</body>
</html>

这两个js文件在上实现了某些功能page2.html，但是当page2.html通过page1.html
这两个文件导航到该文件时，将无法正常工作，但在完成此操作后，data- ajax="false"该文件将起作用。怎么了。应该scripts放在哪里？我需要默认设置，ajax以使过渡更加平滑。

阅读 196

2020-07-26

共1个答案

小编典典

更新资料

根据您更新的问题，您不能将 单页模型 与 多页模型 混合使用。当您首先加载 page2.html时data- role="page，仅第一个加载。其他任何事情都可以忽略。

例：

index.html（已加载第一页）- <html>无论启用还是禁用Ajax，其中的所有标签都将加载到DOM中。

<html>
  <head>
    <!-- JS, CSS, etc.. -->
  </head>
  <body>
    <!-- pages -->
  </body>
</html>

page2.html- 启用*data-role="page" Ajax时，除FIRST 及其内容以外的所有标记均被忽略。 *

<!-- libraries in head are neglected -->
<head>
  <!-- JS, CSS, etc.. -->
</head>
<body>

<!-- ONLY first page is loaded -->
  <div data-role="page">
   <!-- JS -->
  </div>
<!-- next pages are neglected -->
  <div data-role="page">
  </div>
</body>

当使用 Single Page Model 并启用 Ajax时，您必须在其中放置外部页面的JS库/代码<div data- role="page">。

<div data-role="page">
  <script src="file1.js"></script>
  <script src="file.js"></script>
</div>

jQuery Mobile的加载外部通过Ajax的页面，它加载只有先<div data- role="page">在<body，而忽略其他任何标记出方页格。

2020-07-26