jquery - 需要在 jquery mobile 中刷新页面

Question

我在使用 jquery mobile 时遇到一些问题。 当我从第一页移动到第二页时，它没有显示第二页，因为它应该是我每次都需要刷新我的页面。看起来它最初缺少一些 CSS 类。我不明白为什么会发生这种情况。

我正在使用http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css作为CSS

http://code.jquery.com/jquery-1.6.4.min.js

http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js作为JS。

在同一页面上我有这个 anchor 标记

<a href="" onClick="showText()">showText</a>

showText() 方法第一次不会调用，并显示 JavaScript 错误 showText 未定义，但当我刷新页面时，它工作正常。

Answer 1

关于showText():

您必须了解 JQM 的工作原理。为了启用转换等，JQM 将页面拉入并放入 DOM 中。您从第一个页面(类似于 BasePage)开始，该页面完全加载了所有 .js/.css 文件并得到了增强。

当您加载第二页时，JQM 仅获取 data-role="page"id="your-2nd-page"内的内容，并将其添加到第一页之后的 DOM 中!此 div 标签之外的所有脚本以及第二页页眉中的所有 .css 和 .js 文件将不会被 JQM 抓取。

因此，如果你的 showtext() 函数位于页面 div 之外的第二页上，或者位于仅在第二页中使用的 .js 文件中，则它不会被抓取并注入(inject)到 DOM 中，因此你的函数不会工作。

当您刷新第二页时，第二页将是完全增强的 BasePage，因此第二页上的所有脚本都会加载，但是现在第一页上的所有脚本都将不起作用，如果您加载第一页。

解决方案:我将所有 css/脚本放入所有页面中。这样，无论用户从哪里开始，所需的一切都会被加载。