在 jQuery Mobile 项目中，使用 $.mobile.changepage 在页面之间重定向时可能会遇到混乱。出乎意料的是，重定向页面的脚本无法执行，让您一无所知。
要理解这种情况，掌握 jQuery Mobile 的页面处理机制至关重要。它利用 AJAX 加载后续页面。虽然第一个页面按常规加载，但后续页面仅接收其 BODY 内容（具体来说，具有 data-role="page" 属性的第一个 DIV），而 HEAD 内容将被忽略。
这意味着脚本重定向页面的BODY内容中定义的内容将不会执行。原因是页面转换期间未加载包含必要库的父 HEAD。
要解决此问题，请移动 SCRIPT 标签将重定向页面添加到其 BODY 内容中：
<body>
<div data-role="page">
// Other HTML content
<script>
// Javascript code
</script>
</div>
</body>尽管此解决方案有效，但它可能会因多个 SCRIPT 标记而使 HTML 变得混乱。
更好的方法是将所有 JavaScript 逻辑集中在 index.html 中，方法是将其包含在 HEAD 中的单独 JS 文件中：
<head>
<meta name="viewport" ...>
<link rel="stylesheet" href="jquery.mobile-1.2.0.min.css">
<script src="jquery.mobile-1.2.0.min.js"></script>
<script src="index.js"></script> // Custom JS file
</head>虽然解决方案 2 整合了脚本，但将它们包含在 index.html 中仍然至关重要。这主要是由于 Phonegap 的 bug 性质。如果发生错误，Phonegap 可能会刷新当前页面，从而丢失其 DOM。刷新页面的 HEAD 中不存在的任何 JavaScript 代码都不会执行。
通过将脚本集中在 index.html 中，必要的库始终加载在 HEAD 中，即使在潜在的 Phonegap 错误之后也能确保功能不间断.
以上是为什么您的 JavaScript 脚本应该包含在 jQuery Mobile 项目的 index.html 中？的详细内容。更多信息请关注PHP中文网其他相关文章！
