“在导航栏的页面多次初始化” OR“的页面重新初始化在基于的TabBar应用在jQuery Mobile的每个导航” - 镀铬

Question

我有以下标记（在第一个选项卡） -

<div data-role="navbar" class="myClass"> 
    <ul> 
    <li><a rel="external" data-ajax="false" href="Tab1.html" data-transition="slidefade" class="ui-btn-active ui-state-persist" id="favorite" data-icon="custom">Tab1</a></li> 
    <li><a rel="external" data-ajax="false" href="Tab2.html" data-transition="slidefade" id="recent" data-icon="custom">Tab2</a></li> 
    <li><a rel="external" data-ajax="false" href="Tab3.html" data-transition="slidefade" id="contacts" data-icon="custom">Tab3</a></li> 
    <li><a rel="external" data-ajax="false" href="Tab4.html" data-transition="slidefade" id="keypad" data-icon="custom">Tab4</a></li> 
    </ul> 
</div> 

当我通过点击导航栏（通过CSS使其看起来像iOS本地UITabBar）在页面之间切换，每当我导航到Tab（我希望页面在App生命周期中仅初始化一次）时，相应的.html文件被初始化。 。

当我删除属性rel="external" data-ajax="false"该问题已解决，但只有在Safari浏览器中，Chrome浏览器停止导航到页面，并出现错误 - “Error Loading Page Error”。 - < ----这是Chrome浏览器的已知行为吗？

另外，如果我申报的对象喜欢 - window.variable=xyz;存储在window.variable值，只要我从导航即应用程序的页面远输于导航栏，每一个水龙头后重新初始化，我不能够共享window整个应用程序中的对象。

而且，如果我给 - 每当我浏览

<script> 
      $(document).bind("mobileinit", function(){ 
      alert('Page inited');      
}); 
</script> 

在Tab1.html，Tab2.html，Tab3.html和Tab4.html脚本，即在标记了整个头部的头

被称为到我不希望发生的相应的标签页面。

这是Google Chrome浏览器中的一个已知问题/功能吗？也是基于Webkit构建的Safari，其行为有所不同。

Answer 1

绝对除去的rel = “外部” & 数据AJAX = “假” atributes，它们防止页兑现。

然后，你需要打开兑现对这样的：

$(document).one("mobileinit", function() { 
    $.mobile.page.prototype.options.domCache = true; 
}); 

使用此选项的情况下，只有你要兑现每一个页面。在这种情况下，你要兑现只有某些网页上使用这样的比喻：

<div data-role="page" id="cacheMe" data-dom-cache="true"> 

您还可以通过编程缓存页面是这样的：

pageContainerElement.page({ domCache: true }); 

如果你有多个HTML-S多页时需要使用数据预取属性是这样的：

<a href="prefetchThisPage.html" data-prefetch> ... </a> 

在这里你会找到有关这种兑现我的其他答案：https://stackoverflow.com/a/14019929/1848600

现在一些关于持久对象。如果你按照上面的说明，你可以简单地创建一个持久化对象是这样的：

VAR someObject = { 选项1：“”， 选项2：0， 2选项：“” //等。 }

的rel = “外部” & 数据AJAX = “假”将防止对象在JQM情况下的持久性，这些属性像页面刷新。