Jquerymobile - $ .mobile.changepage

我想从我的.js文件中打开.html文件。所以我使用$ .mobile.changePage（“file.html”）。在file.html中有file.js.但是file.html在调用file.html时不会调用。

THanks提前。

first.js

$.mobile.changePage ("file.html");

file.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>jQuery Mobile Framework - Dialog Example</title> 
<link rel="stylesheet" href="jquery.mobile-1.0a2.min.css" /> 
<script src="jquery-1.4.4.min.js"></script> 
    <script src="jquery.mobile-1.0a2.min.js"></script> 
    <script src="../Scripts/file.js"/> // Could not imported 
    <script src="../Scripts/helperArrays.js"/> // Could not imported 
    <script src="../Scripts/globalVariables.js"/> // Could not imported 
</head> 
<body> 

<div data-role="page"> 

    <div data-role="header" data-nobackbtn="true"> 
    <h1>Vaults</h1> 
    </div> 

<!-- <div data-role="content" data-theme="c" id="contentVault"> 

    <a href="Views/searchPage.html" data-role="button" data-theme="b">Sample Vault</a>  
    <a href="Views/searchPage.html" data-role="button" data-theme="c">My Vault</a>  
    </div> --> 

     <div data-role="content" id="content"> 
     <ul id="listview" data-role="listview" data-inset="true" data-theme="e" data-dividertheme="b">    
      <li id="listdiv" data-role="list-divider">List of Items</li> 
     </ul>  
     </div><!-- /content --> 

</div> 


</body> 
</html>

请帮助我..

来源

2010-12-22 Finder

jQuery Mobile的通过AJAX变得页面，并增加了他们的内容到当前页面。我看到一些关于将页面标题更改为传入页面的通知，因此他们（计划）访问头部，但目前jquery mobile在加载页面时似乎不会加载外部js。

更重要的是 - 如果你使用$（文件）。就绪（），它不会被触发，因为它是AJAX

来源

2010-12-22 12:56:51 naugtur

嗨..我怎样才能调用外部JS？ – Finder 2011-01-06 05:09:48

你应该用jquerymobile时尚来写你的JS--作为页面的增强。将它与`

当JQM载入你的专区内通过AJAX另一页是只吸入任何东西[数据 - 角色=“页面”]，别无其他，像头

所以，你可以的，如果你想，包括这个div内的任何JS/CSS，问题是，如果这个页面被访问多次任何CSS都会积累，但JS的问题更加严重。

基本上每个页面都会附加到DOM，所以如果您使用全局选择器（如$（'div.someClass'）），则JS会在整个DOM上运行（每个页面加载），即使使用ID isn这不是一个完美的解决方案，因为如果你能连接两次相同的页面。

小网站

我已经将所有的CSS成一个文件和JS代码解决了这个，我想每个页面加载时运行，我绑定到pageinit和pageshow JQM事件：

<script type="text/javascript">   
$("div:jqmData(role='page'):last").bind('pageinit', function(){ 
      //your code here - $.mobile.activePage not declared 
    }); 

    $("div:jqmData(role='page'):last").bind('pageshow', function(){ 
      //your code here - $.mobile.activePage works now 
    }); 
</script>

当页面加载的pageinit事件运行，永远只能一次（它的加载后，它停留在内存中，如果您导航回到它，甚至通过后退按钮，这是不会再次发射），另一方面，页面显示每次显示页面时都会触发，ev例如，当您通过浏览器上的后退按钮导航回到它时。

pageinit在DOM存在的情况下运行，pageshow事件仅在您有一些代码依赖于正在呈现的DOM而您需要通过$ .mobile.activePage或某些数据更改时快速参考活动页面每次显示时都需要刷新。对于大多数目的，我只使用pageinit作为jQM的document.ready，并在那里绑定我的事件。对静态元素使用bind，而不是对动态元素进行实时处理，因为实况事件在文档根处侦听，您想要在页面div处侦听。

对于大型网站

对于大型网站有一个现场活动结合到任何网页和处理类型的页面的优势，这样的js代码并不多装一旦。

如果你有外援的助手功能，你只需要把它放在所有页面的头部（如果没有太多），如果你有一个非常大的网站，你可能会做得更好通过跟踪哪些JS文件已经加载服务器端。

这一切都可以通过只是没有使用AJAX来加载新的页面是可以避免的，所以想想转换/加载效果是否值得

* 下面是如何处理大JQM网站：*

绑定现场活动的所有页/对话框pageinit和pageshow事件：

$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function(event){

我引用的每个页面有一个名字：<div data-role="page" data-mypage="employeelist">
在你基本上可以为每个页面“名” switch语句这个现场活动，然后检查event.type为pageinit/pageshow或两者并将代码放在那里，然后每次创建/显示页面时，此事件将被触发，它知道触发了哪个页面，然后调用相应的代码。最终我的代码太多了，所以我建立了一个处理程序obj ECT每个页面的JS被包含在一个单独的js文件，可以与现场注册事件处理程序

的缺点是，所有的JS对你的整个网站加载的用户达到第一页上，但精缩即使是一个大的网站也比jQuery或jQM小，所以这不应该成为一个问题。优点是每次用户导航到新页面时，您不再通过AJAX为每个页面加载所有JS。

*注意：现在RequireJS可以使这个更易于管理

来源

2012-01-31 18:38:15

Jquerymobile - $ .mobile.changepage

回答

相关问题