web-dev-qa-db-ja.com

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
Serhiy

答えてくれてありがとう、そして彼らは私のためにかなりうまくいかなかったにもかかわらず、彼らは私が探していたコードを見つける方向に私を指し示しました。

これは、この紳士のGithub Gistで見つけたコードです。

https://Gist.github.com/92192

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

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

そのGistには戻るボタンのコードもありますが、戻るボタンが正常に機能しているように見えるので、実際には必要ないようです...

36
Serhiy

デフォルト値を上書きしようとしましたか?

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

これは私のために働く

6
jrenouard

JQM RC1では、ページキャッシュがデフォルトでオフになりました。ページキャッシングについては、jQM Webサイトから以下の抜粋を参照してください。 http://jquerymobile.com/demos/1.0rc1/docs/pages/page-cache.html

必要に応じて、以前にアクセスしたページを削除するのではなく、DOMに保持するようjQuery Mobileに指示できます。これにより、ユーザーがページに戻ったときにすぐに利用できるようにページをキャッシュできます。

以前にアクセスしたすべてのページを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
Martin

方法1

これにより、AJAXが無効になります

読み取り http://jquerymobile.com/demos/1.0a2/#docs/api/globalconfig.html

ajaxLinksEnabledをfalseに設定すると、これらのページはロードおよびキャッシュされず、通常のリンクとして機能します。

方法2

2番目のアイデアは、キャッシュされた要素を削除することです。 pagehideイベントにバインドして、代わりにページを削除できます。 DOMに存在しない場合、ページが再度読み込まれます。

概念実証としてこのコードを使用して実行できます。

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

しかし、少し作業が必要です。上記のコードは歴史を壊します。サイトマップツリーに残す予定のページでのみ使用できることが証明されています。そのため、特別なセレクターを作成するか、特定のページのみにバインドする必要があります。

また、ボタンのクリックまたはマウスダウンイベントにバインドし、hrefを取得し、そこからページIDを生成し、jqmが検索する前にIDでdivを見つけて削除します。

キャッシュを無効にしたり、ロードを強制したりする方法はありません。

4
naugtur

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
KCD

私の作業ソリューションは次のとおりです。

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

そのトピックについての記事(ドイツ語の原文)を書きました。 Google翻訳記事へのリンク

1
Sebastian Sauer