如果我在第一次加载后不刷新页面，js 不起作用，为什么？答案

【问题标题】：js doesn't work if I don't refresh the page after first load,why?如果我在第一次加载后不刷新页面，js 不起作用，为什么？
【发布时间】：2012-04-04 07:01:11
【问题描述】：

如果我在第一次加载后不刷新页面，js 将不起作用，并且 div 的 background-img 也不会显示。代码：<a data-role="button" data-icon="plue" href="register.jsp" data-transition="pop">register</a> 如果我设置data-ajax='false'，js和css可以成功加载，但是我想要一个过渡

【问题讨论】：

我们需要一些代码示例开始...
js 在我设置 data-ajax='false'.. 后启用，我尝试使用 $("...").live("pageinit",function().. .and $(document).ready(function()..)，但还是不行

标签： jquery jquery-mobile

【解决方案1】：

当 AJAX 开启时，jQM 不会加载整个页面，它会获取页面，然后去除 head 标签中的任何内容。他们的逻辑是，这些内容将在整个应用程序中保持一致，因此为了减少下载和加快加载时间，将其删除、解析 HTML 并将其作为新页面注入（这就是为什么您还可以获得主题标签导航）。

如果 AJAX 正在运行，jQM 也不会运行页面内的任何 JS。因此，如果您正在执行onClick="SomeJS();" 之类的操作，它将不会运行。一般来说，你不应该对 jQuery 做任何事情。

为了解决这个问题并防止不是每个页面上的元素出现 JS 错误，我已经开始做这样的事情：

在你的 body 标签之后，放置一个带有 id 或不同类的包装器 DIV 或 Section（因为任何智能手机都能很好地读取 HTML5）并添加 data-role="page" 属性。

<body>
<div id="page1" data-role="page">
... page content ...
</div>
</body>

将所有 JS 保存在一个文件中，或在每个页面上引用所有文件。当您有一个需要运行的特定于页面的脚本时，请将其包装成如下内容：

$('#page1').live('pageshow', function() {
//do what you need to do
});

希望对您有所帮助。

【讨论】：

哦，还有，jQM 也忽略了 body 标签，所以你不能在那里应用特殊的 ID/data-page 属性并让它工作。
谢谢你的回答对我很有帮助~