导航到其他html页面时，jQueryMobile页面事件不触发 [英] jQueryMobile page events not firing when navigating to a different html page
问题描述
我正在尝试使用
$.mobile.changePage( "PlayGame.html", { transition: "slideup"}, true, true)
PlayGame.html已转换为，但以下各项均未触发:
PlayGame.html is being transitioned to, however, none of the following are firing:
$(document).bind("mobileinit", function()
{
alert(1);
});
$('#gamePage').live('pageinit',function(event, ui)
{
alert('pageinit');
});
$('#gamePage').live('pagebeforeshow',function(event, ui)
{
alert('booooo');
});
但是，如果我执行window.location.href = "PlayGame.html"，则所有内容都会相应触发.
However, if I do window.location.href = "PlayGame.html" then everything fires accordingly.
我想念什么?
谢谢
汤姆
推荐答案
如果您示例中的代码在PlayGame.html文档的<head>中，则当jQuery Mobile框架通过以下方式抓取页面时，该代码将不包括在内AJAX.这就是为什么您的自定义代码在加载整个页面时运行，而不是在单击另一页面上的链接时运行的原因.
If the code in your example is in the <head> of the PlayGame.html document then it will not be included when the jQuery Mobile framework grabs the page via AJAX. That is why your custom code runs when you load the whole page but not when clicking on a link from another page.
您可能希望将自定义JavaScript放在一个文件中，然后将其包含在每个页面上(因此无论用户从哪个页面进入您的网站，它都将可用)，或者您希望为每个移动自定义JavaScript页面放入每个页面的<div data-role="page">元素中(因此当页面被拉入DOM时将包含在该元素中.)
You will want to either put your custom JavaScript in a single file and include it on every page (so it will be available no matter what page the user enters your site from) or you will want to move the custom JavaScript for each page into the <div data-role="page"> element for each page (so it will be included when the page is pulled into the DOM).
原因是，当您单击指向外部文件的链接时，jQuery Mobile使用AJAX提取<div data-role="page">元素的第一个实例并将该元素放置在当前DOM中，文档中的所有其他内容都将被丢弃
The reason is that when you click on a link to an external file, jQuery Mobile uses AJAX to pull out the first instance of a <div data-role="page"> element and places that element in the current DOM, everything else in the document is discarded.
以下是有关jQuery Mobile导航工作原理的一些建议读物: http://jquerymobile. com/demos/1.0rc2/docs/pages/page-navmodel.html
Here is some suggested reading about how jQuery Mobile navigation works: http://jquerymobile.com/demos/1.0rc2/docs/pages/page-navmodel.html
这篇关于导航到其他html页面时，jQueryMobile页面事件不触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
