我为每个页面都有一个文件,我试图在每个页面上实现pageinit事件处理程序(我认为严格属于一个页面,应该在那里声明),如下所示:
<body> <div id="myPage" data-role="page"> <!-- Content here --> <script type="text/javascript"> $("#myPage").live('pageinit',function() { // do something here... }); </script> </div> </body>
该事件被正确绑定到页面,因此代码被执行但是 – 现在我的问题 – 如果我转到另一个页面并稍后返回pageinit事件将执行两次.我认为那是因为.live方法再次将pageinit事件绑定到页面.但是,pageinit事件不应该只在页面初始化时调用一次吗?我在这里缺少什么?
解决方法
我认为最好将您的JavaScript代码移动到另一个文件中,因为当您浏览网站jQuery Mobile时可能会清理(读取:从DOM删除)myPage页面,因此必须再次加载它并且hense重新运行同一个块您定义的代码并为pageinit事件绑定2个侦听器.
这基本上是他们建议使用live或on函数的原因,但如果你在页面上包含绑定代码,它就会失败;)
但是,如果您坚持将代码放在每页上,而不是使用bind而不是live.
参考:http://jquerymobile.com/demos/1.0/docs/pages/page-cache.html
jQuery Mobile therefore has a simple mechanism to keep the DOM tidy. Whenever it loads a page via Ajax,jQuery Mobile flags the page to be removed from the DOM when you navigate away from it later (technically,on the pagehide event).