jQuery Mobile-与页面一起加载脚本(pagecontainershow) [英] Jquery Mobile - load script along with page (pagecontainershow)
问题描述
我正在使用jQuery Mobile 1.4.0构建移动Web应用程序，并且出于组织目的，我为每个页面使用了不同的html文件，因为这将是一个相当大的应用程序.
I am building a mobile web application using jQuery Mobile 1.4.0, and I am using different html files for each page for organizational purposes, as this will be a rather large application.
我知道该文档未在辅助页面上使用，因为jQuery Mobile中的链接通过AJAX从文件中提取data-role ="page"内的信息，并将其插入dom并显示.我很好.
I understand that the document is not utilized on secondary pages because a link in jQuery Mobile pulls the info inside of data-role="page" from the file via AJAX and inserts it into the dom and displays it. I am fine with that.
我希望文件中的javascript也能被利用(我不想使用data-ajax = false并丢失转换等).阅读文档后，我认为我可以使用:
What I would like is for the javascript in the file to be able to be utilized as well (I do not want to use data-ajax=false and lose the transitions etc.). Upon reading the docs I thought I may be able to use:
$(document).on('pagecontainershow', function(event, ui) { });
并获得我想要的结果.这在第一页上工作正常，但在后续页面上不起作用，除非我在新标签页/会话中将URL手动输入到浏览器中.所以我尝试了
and get the result I want. This works fine on page one, but does not work on subsequent pages unless I manually enter that URL into the browser in a new tab/session. So I tried
$('#pageid').on('pagecontainershow', function(event, ui) { });
认为可以解决问题，希望jQM知道使用适当的ID将其与该页面一起拉出.但是，这根本不起作用.
thinking that might do the trick, hoping that jQM would know to pull it with that page, by using the proper ID. However this does not work at all.
所以现在我被困住了.有人可以帮忙吗?我无法想象我是唯一不想在主页上保留成千上万行javascript的人.
So right now I'm stuck. Can anyone help? I can't imagine i'm the only person that doesn't want to keep thousands and thousands of lines of javascript on the main page.
预先感谢
推荐答案
jQuery Mobile通过HTTP加载第一页，而其余的 external 页则通过Ajax加载.在单页模型中，它首先在<body>中加载data-role="page"，而忽略data-role="page"之外的其余元素.
jQuery Mobile loads first page via HTTP and the rest of external pages via Ajax. In Single Page Model it loads first data-role="page" in <body> and neglects the rest of elements outside data-role="page".
为解决此问题并加载第一页中未包含的其他库，您需要将它们放置在任何外部页的data-role="page"内.
To overcome this problem and in order to load different libraries which aren't included in first page, you need to place them inside data-role="page" of any external page.
如果您关闭Ajax data-ajax="false"，则页面将通过HTTP正常加载.
If you turn ajax off data-ajax="false", pages will be loaded normally via HTTP.
这篇关于jQuery Mobile-与页面一起加载脚本(pagecontainershow)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
