如何在 jQuery Mobile UI 中禁用缓存

StackOverflow https://stackoverflow.com/questions/4660934

题

尝试过...

<div data-role="page" data-cache="30"> 
<div data-role="page" data-cache="never">
<div data-role="page" data-cache="false"> 
<div data-role="page" cache="false">

似乎没什么作用...所以目前我正在通过...解决服务器端的问题

.'?x='.rand()
.'&x='.rand()

我不想仅禁用 AJAX 缓存。但必须有更好的方法......我错过了什么吗？

谢谢，

谢尔希

有帮助吗？

解决方案

感谢您的答案，尽管他们对我不太有效，但他们确实指出了我寻找我正在寻找的代码的方向。

这是我在这位绅士的Github Gist上发现的代码。

https://gist.github.com/921920

jQuery('div').live('pagehide', function(event, ui){
  var page = jQuery(event.target);

  if(page.attr('data-cache') == 'never'){
    page.remove();
  };
});

那个要点也有一个返回按钮代码，但是我似乎真的不需要它，因为我的后退按钮似乎正常...

其他提示

您是否尝试过覆盖默认值？

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

这对我有用

默认情况下，JQM RC1中的页面缓存已关闭。请参阅下面的JQM网站上有关页面缓存的摘录： http://jquerymobile.com/demos/1.0rc1/docs/pages/page-cache.html

如果您愿意，可以告诉JQuery Mobile将先前访问的页面保存在DOM中，而不是将其删除。这使您可以缓存页面，以便如果用户返回到它们，则可以立即使用。

要将所有先前访问的页面保留在DOM中，请将页面插件上的DOMCACHE选项设置为true，如下：

$.mobile.page.prototype.options.domCache = true;

另外，要仅缓存一个特定的页面，您可以将data-dom-cache =“ true”属性添加到页面的容器：

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

您也可以通过以下方式通过以编程方式缓存页面：

pageContainerElement.page({ domCache: true });

DOM缓存的缺点是DOM可以变得很大，从而导致某些设备上的记忆问题减慢和内存问题。如果启用DOM缓存，请注意自己管理DOM并在各种设备上进行彻底测试。

方法一

这会禁用 AJAX

读http://jquerymobile.com/demos/1.0a2/#docs/api/globalconfig.html

放 ajaxLinksEnabled 设置为 false 则不会加载和缓存这些页面，只是像普通链接一样工作。

方法二

第二个想法是删除缓存的元素。您可以绑定到 pagehide 事件并使其删除页面。如果 DOM 中不存在，则页面将再次加载。

可以使用以下代码作为概念证明来完成：

$('.ui-page').live('pagehide',function(){ $(this).remove(); });

但这需要做一些工作。上面的代码打破了历史。它证明您只能将其与您打算成为站点地图树中的叶子的页面一起使用。因此，您必须为它们创建一个特殊的选择器或将其仅绑定到某些页面。

您还可以绑定到按钮的单击或 mousedown 事件，获取其 href，从中生成页面 id，并通过 id 查找 div 以在 jqm 尝试查找它之前将其删除。

我没有找到禁用缓存或强制加载的建议方法。

我认为马丁的答案应该是正确的答案，但是无论如何，JQuery Mobile Cache都是第一页。 https://github.com/jquery/jquery-mobile/issues/3249

我选择了“修补”的行为 $.mobile.page.prototype.options.domCache = false 和 data-dom-cache="true"

$(document).on('pagehide', function (e) {
    var page = $(e.target);
    if (!$.mobile.page.prototype.options.domCache
        && (!page.attr('data-dom-cache')
            || page.attr('data-dom-cache') == "false")
        ) {
        page.remove();
    }
});

这是我的工作解决方案：

$('.selector').live( 'pagebeforecreate', function () {
    $.mobile.urlHistory.stack = [];
    $.mobile.urlstack = [];
    $( '.ui-page' ).not( '.ui-page-active' ).remove();
});

我写了一篇有关该主题的（德语）文章，也许有帮助。链接到Google翻译的文章

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top