jquery mobile拦截了所有的http请求，并使用ajax请求取代传统的http。请求发出后，框架会将请求的内容插入到页面中data- role="page"的部分，取代原来的内容。因而如果请求的新页面在head部分加载了其他的js ，此时框架并不会加载该部分的js 。
这就意味着head部分的js 和css在绝大部分情况下并不会被加载并执行，通常情况下建议所有页面使用一套统一的js 和css。但如果应用开发的复杂度较高或者为分工合作开发时，我们需要根据不同的页面加载不同的js 或样式，这时候可以使用jquery mobile提供的pagecreate开发方法 解决该问题。
我们知道在使用jquery 框架时，我们习惯使用
$(document).ready(function(){ // do something })
但这个开发方法 在jquery mobile中，因为jquery mobile特殊的请求机制（ajax请求），很多时候并不能达到我们希望的功能。jquery mobile提供了pagecreate的事件。
下面我们可以通过一个简单的例子，使用pagecreate实现不同page加载不同js 的功能：
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>demo</title> </head> <body> <div data-role="page" id="pageone"> <div data-role="header"> <h1>page one header</h1> </div> <div data-role="content"> <p>page one content</p> <a href="#pagetwo">page two</a> </div> <div data-role="footer"> <p>page one footer</p> </div> </div><!-- /pageone --> <div data-role="page" id="pagetwo"> <div data-role="header"> <a data-rel="back">back</a> <h1>page two header</h1> </div> <div data-role="content"> <p>page two content</p> </div> <div data-role="footer"> <p>page two footer</p> </div> </div><!-- /pagetwo --> <script> $(document).on("pagecreate", "#pageone", function(){ alert("page one create"); }); $(document).on("pagecreate", "#pagetwo", function(){ alert("page two create"); }); </script> </body> </html>
这样，页面在一开始渲染时，只会执行 alert("page one create"); 当a标签跳转到pagetwo时才会执行：alert("page two create");
当然还有其他解决方法 ，比如在a标签上加上如:data-ajax='false',rel='external',只是这样做的话转场效果会失效。