在我的phonegap+jquerymobile项目中，我使用$.mobile.changepage进行重定向。然而让我困惑的是，我需要把所有页面的脚本都放到同一个index.html文件中。如果不这样做，重定向页面将无法执行其头部中的函数。
例如，我的index.html似乎是这样的：$(document).bind("deviceready",function(){$.mobile.changepage("test.html");})
接着，我的设备会重定向到test.html，它看起来像是：
$("#btnTest").click(function(){alert("123");})
<button id="btnTest">Test</button>
本文也可以在我的博客这里找到。
要理解这种情况，您需要了解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>
这是一个快速解决方案，但还是有些丑陋。
可以在我的另一个回答中找到实际工作示例：changepage 后 pageshow 未触发
另一个有效的示例：使用 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 绝不能像一个普通的Web应用程序一样工作。
<a href="#second" class="ui-btn-right" rel="external">Next</a>
官方文档，请查找章节：无需使用Ajax进行链接
现实解决方案将使用解决方案2。但不同于方案2，我会使用同一个index.js文件，并将其初始化到每个可能的其他页面的HEAD中。
现在你可以问我为什么？
Phonegap和jQuery Mobile一样存在漏洞，迟早会出现错误，如果所有js内容都包含在一个HTML文件中，则您的应用程序将失败（包括已加载的DOM）。DOM可能会被删除，Phonegap将重新加载您当前的页面。如果该页面没有javascript，它将不起作用，直到重新启动。
可以通过良好的页面架构轻松解决此问题。如果有人感兴趣，我写了一篇有关良好的jQuery Mobile页面架构的文章。简而言之，我讨论了在成功创建您的第一个应用程序之前，了解jQuery Mobile工作原理的知识是您需要知道的最重要的事情。
deviceready，请使用以下语法调用特定于您的页面的js函数。$(document).on('pageshow', '#YourPageID', function(){
// Your code goes here
});