jQuery mobile $（document）.ready等效
在ajax导航页面中，执行初始化JavaScript的经典“文档就绪”forms根本不会触发。
什么是正确的方式来执行ajax加载页面中的一些代码？
（我的意思是，不是我的ajax …这是jQuery的移动页面导航系统，把我带到那个页面）
好吧，我怀疑这样的事情…非常感谢=）但是…它仍然不起作用，这是我的代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>mypage</title> <link rel="stylesheet" href="jquery.mobile-1.0a4.min.css" /> <script type="text/javascript" src="jquery-1.5.min.js"></script> <script type="text/javascript" src="jquery.mobile-1.0a4.min.js"></script> <script type="text/javascript"> $('div').live('pageshow',function(event, ui){ alert('ciao'); }); </script> </head> <body> <div data-role="page"> <div data-role="header" data-position="fixed"> <h1>Shopping Cart</h1> </div> <div data-role="content"> asd </div> </div> </body>
我需要指定div ID吗？
我花了一些时间研究相同的内容，因为JQM文档在这一点上不是很详细。 下面的解决scheme适合我：
<script type="text/javascript"> $('div:jqmData(role="page")').live('pagebeforeshow',function(){ // code to execute on each page change }); </script>
您必须实现自己的检查stream程，以防止多次初始化，因为上面的代码将在每次页面更改时运行
绑定到“pageinit”事件。 从JQM文档： http ： //api.jquerymobile.com/pageinit/
$(document).ready()的最好等价物是$(document).bind('pageinit')
只需看一下jQuery Mobile文档： http : //jquerymobile.com/demos/1.1.1/docs/api/events.html
重要：使用$（document）.bind（'pageinit'），而不是$（document）.ready（）
你在jQuery中学到的第一件事就是调用$（document）.ready（）函数中的代码，这样一旦DOM被加载，所有的东西都会被执行。 但是，在jQuery Mobile中，Ajax用于在浏览时将每个页面的内容加载到DOM中，而DOM就绪处理程序仅对第一页执行。 要在加载和创build新页面时执行代码，可以绑定到pageinit事件。 这个事件在本页底部详细解释。
如果你想让代码在某个页面上运行（我敢打赌是这种情况），你可以使用这种模式：
$('div:jqmData(url="thepageyouwanted.html")').live('pageshow',function(){ // code to execute on that page //$(this) works as expected - refers the page });
您可以使用的事件：
-
pagebeforeshow在转换之前开始 - 过渡后，
pageshow启动 -
pagecreate只在第一次加载页面时开始
每次显示时，都会调用所有的pageshow和pagebefore show事件。 如果你想要第一次发生的事情，你可以做这样的事情：
$('#pageelementid').live("pagecreate", pageInitializationHandler);
然后在你的代码中：
function pageInitializationHandler(event) { //possibly optional based on what exactly you're doing, //but keep it in mind in case you need it. //Also, this seems to need to be an exact duplicate of the //way you used it with the .live() method or jQ/jQM won't unbind //the right thing $('#pageelementid').die("pagecreate", pageInitializationHandler); //Do your actual initialization stuff }
我发现这个特别有用，当你在做多个JQM“页面”的HTML文件。 我设置我的，所以整个shebang的实际初始化代码是在我的主要页面（文件），然后所有其他的子页面有一个pagecreate处理程序，检查是否初始化代码已被解雇，如果不是，做$ .mobile.changePage（“＃mainpage”）。 工作得很好。
如上所述，pageinit事件可以工作。 但是，如果您遇到了多物理页面情况（例如：从index.html导航到mypage.html），则执行的function位于父级。
pageinit中的任何逻辑都必须属于父项，而不是加载的链接。 您无法在导航到的页面上调用函数，因为导航是通过JQM中的ajaxcallback处理的，并且您的子页面上的项目将超出范围。
在这种情况下，你可以使用data-ajax =“false”属性：
<a href="mypage.html" data-ajax="false">My Page</a>
这样做将删除ajax导航，做一个完整的页面重新加载，这反过来将触发$（document）.ready函数在您正在加载的页面上。
