题 如何在jQuery Mobile UI中禁用缓存


试了...

<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。必须有更好的方法......我错过了什么吗?

谢谢,

谢尔盖·


27
2018-01-11 18:01


起源




答案:


谢谢你们的答案,即使他们不适合我,他们确实指出了我找到我正在寻找的代码的方向。

这是我在这位绅士的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();
  };
});

在Gist中还有一个后退按钮代码,但我似乎并不需要它,因为我的后退按钮似乎工作得很好......


36
2018-06-30 14:38



不错。这也适用于未来的版本。 - naugtur
谢谢!这解决了我的许多问题。 - pcasa
只需快速说明,就像jQuery 1.7一样 .live() 方法不赞成使用 .on()。所以一个更新的例子就是 jQuery(document).on('pagehide', 'div', function(event, ui) { ... }); - stereoscott
同样因为这也删除了对话框的父母,打破了界面。你需要这样的东西: if (ui.nextPage && ui.nextPage[0] && $(ui.nextPage[0]).is('.ui-dialog')) return; 在第1行和第2行之间。 - cherouvim
另外两件事要考虑:1)浏览器仍然可以缓存页面,我不得不阻止它以使其工作。 2)您可以将page.attr('data-cache')更改为page.data('cache')以允许动态缓存决策。 - Edyn


您是否尝试覆盖默认值?

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

这对我有用


6
2018-01-25 09:55





现在,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并在一系列设备上进行彻底测试。


5
2017-10-02 19:28



仅供参考,DOM缓存已关闭,但我认为仍有一些其他类型的缓存会导致动态Web应用程序出现问题。我正在1.0发布,我看到我的应用程序的缓存问题。从缓存中强制删除页面的已接受答案似乎可以缓解这些问题。 - John Bubriski
这可能是解释 - “jQuery Mobile总是缓存第一页” forum.jquery.com - KCD


方法1

这会禁用AJAX

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

ajaxLinksEnabled 为false,它不会加载和缓存这些页面,只是作为普通链接工作。

方法2

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

可以使用此代码作为概念证明:

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

但它需要一点工作。上面的代码打破了历史。它证明您只能将它用于您打算在站点地图树中留下的页面。因此,您必须为它们创建一个特殊选择器或将其绑定到仅某些页面。

你也可以绑定到一个按钮的click或mousedown事件,获取它的href,从中生成页面id并在jqm尝试查找之前找到div by id以将其删除。

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


4
2018-01-12 07:37



谢谢,但我没有运气这个方法...... - Serhiy


在我看来,Martin的答案应该是正确的,但jQuery Mobile无论如何都会缓存第一页。 https://github.com/jquery/jquery-mobile/issues/3249

我选择了“补丁”的行为 $.mobile.page.prototype.options.domCache = falsedata-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();
    }
});

2
2017-11-26 04:45





这是我的工作解决方案:

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

我写了一篇关于该主题的(德语原文)文章,也许这有帮助。 链接到谷歌翻译的文章


1
2018-06-26 10:31



谢谢,但我对这种方法没有任何好运...这个版本是什么版本... alpha或beta ...? - Serhiy