我已经使用 $.mobile.changepage 在我的 phonegap+jquerymobile 项目中进行重定向。然而让我感到困惑的是，我需要将所有页面的脚本放在同一个文件 index.html 中。如果不是，则重定向页面无法执行其标头中的功能。
例如，我的 index.html 似乎是
$(document).bind("deviceready",function(){$.mobile.changepage("test.html");})
然后，我的设备将重定向到 test.html，这似乎是
$("#btnTest").click(function(){alert("123");})
<button id="btnTest">Test</button>
但是，脚本永远不会在 test.html 中执行。然后我把脚本放到index.html，我期望的就完成了。不管怎样，如果我把所有的脚本都放在同一个页面上，这个项目将变得越来越难以保存。感谢您的帮助。
这篇文章也可以在这里找到，作为我博客的一部分。
要了解这种情况，您需要了解 jQuery Mobile 的工作原理。它使用ajax加载其他页面。
第一页正常加载。它的HEAD和BODY被加载到 中DOM，它们在那里等待其他内容。加载第二页时，仅将其BODY内容加载到DOM. 更准确地说，甚至BODY还没有满载。只会加载第一个具有 data-role="page" 属性的 div，其他所有内容都将被丢弃。即使您有更多页面，也BODY只有第一个页面将被加载。此规则仅适用于后续页面，如果您在初始HTML 中有更多页面，则所有页面都将被加载。
这就是为什么您的按钮显示成功但单击事件不起作用的原因。HEAD在页面转换过程中忽略了父级的相同点击事件。
这是官方文档：http : //jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
不幸的是，您不会在他们的文档中找到这一点。以太他们认为这是一个常识，或者他们忘记像我的其他主题一样描述这个。（jQuery Mobile 文档很大但缺少很多东西）。
在您的第二页和其他所有页面中，将您的SCRIPT标签移动到BODY内容中，如下所示：
<body>
<div data-role="page">
// And rest of your HTML content
<script>
// Your javascript will go here
</script>
</div>
</body>
这是一个快速的解决方案，但仍然是一个丑陋的解决方案。
可以在我的其他答案中找到工作示例：更改页面后未触发页面显示
另一个工作示例：使用 jQuery-mobile 转换以不同方式加载页面
将您所有的 javascript 移动到原始的第一个 HTML 中。收集所有内容并将其放入单个 js 文件中，放入HEAD. 在 jQuery Mobile 加载后初始化它。
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="index.js"></script> // Put your code into a new file
</head>
最后，我将描述为什么这是一个好的解决方案的一部分。
在按钮和用于更改页面的每个元素中使用rel="external"。因此，ajax 不会用于页面加载，您的 jQuery Mobile 应用程序将像普通的 Web 应用程序一样运行。不幸的是，这对您的情况来说不是一个好的解决方案。Phonegap 永远不应该作为一个普通的网络应用程序工作。
<a href="#second" class="ui-btn-right" rel="external">Next</a>
官方文档，找一章：Linking without Ajax
现实的解决方案将使用解决方案 2。但与解决方案 2 不同的是，我将使用相同的 index.js 文件并在HEAD每个可能的其他页面中对其进行初始化。
现在你可以问我为什么？
Phonegap就像 jQuery Mobile 有问题一样，如果您的每个 js 内容都在单个 HTML 文件中，那么迟早会出现错误并且您的应用程序将失败（包括加载的 DOM）。DOM 可能会被删除，Phonegap并将刷新您当前的页面。如果该页面没有 javascript，则在重新启动之前它将无法工作。
这个问题可以通过良好的页面架构轻松解决。如果有人有兴趣我已经写了一篇文章谈好jQuery Mobile的页面架构。简而言之，我正在讨论有关 jQuery Mobile 如何工作的知识是您在成功创建第一个应用程序之前需要了解的最重要的事情。
与普通的 HTML 页面不同，jQuery Mobile 在页面之间导航时使用 ajax 技术。因此，请确保在所有 html 页面中导入所有 JS 文件和库。
如果您仔细观察，您会发现加载第二页时会考虑上一页的 JS 文件。但是如果你强制刷新当前页面，那么当前页面的js文件就会生效。
所以正如我之前所说，确保在所有 html 文件中导入 js 文件。
也无需调用deviceready，使用以下语法调用页面特定的 js 函数
$(document).on('pageshow', '#YourPageID', function(){
// Your code goes here
});
Jquery Mobile 使用 ajax 加载“页面”。这里的“页面”是一个带有 data-role=page 的 div。如果加载物理页面 index.html，则可以使用 changePage 导航到该页面内的任何“页面”div。
但是，如果您想从其他物理页面加载“页面”，jQM 只会加载该页面的第一个“页面”div。实际发生的是您不更改页面，jQM 只是使用 ajax 加载该特定“页面”div 并将其注入当前页面。
您有两种可能的架构，将所有“页面”放在一个 html 页面中并从那里导航。或者你可以有多个页面架构。你总是可以混合这个。
要物理更改页面，您需要在链接中添加 rel=external。