2011-08-03 9 views
2

jQueryモバイルでは、ユーザーの入力に応じてカスタムコンテンツが挿入された動的な「ページ」テンプレートを使用しています。動的ページをキャッシュするjQueryモバイルを停止します

すべては動作しますが、一旦ページが作成されるとキャッシュされ、戻って新しい選択を行うと新しい値が表示されません。私は、次の修正プログラム適用しようとしました:

$('#instrument').bind('pagehide', function(){ 
    $(this).remove(); 
}); 

ページを削除し、しかし、あなたが戻って、そのページに移動しようとした場合には、再初期化されませんし、私はちょうどに押し戻さ取得しておこう私のアプリの始まり。

pagebeforecreateを使用して動的コンテンツをページに追加する必要があります(実際のHTMLは重要ではないようですので、ここでは取り上げません)。そうでない場合はフォーマットされません。 pagebeforeshowを使用した場合、コンテンツはフォーマットされませんが、新しい選択をして戻ると変更されます。

私は私の人生のために把握することはできません私はpagebeforecreateがページをキャッシュすることを実現し、私が原因:(

を書式ないコンテンツに他の方法を使用できることは表示されません。修正

答えて

5

pagebeforeshowを使用してみてくださいが、ページがすべての書式を修正することが示されたときpage()を呼び出すこのよう

:!。

$('#instrument').bind('pagebeforeshow', function() { 
    // Do your content insertion 
}); 

$('#instrument').bind('pageshow', function() { 
    $(this).page(); 
}); 

この「半分」のみが機能します(ページが更新されたときに書式を更新しません)。その場合は、this trick:ページを一時要素にラップし、ラッパーでpage()を呼び出してみてください。

$('#instrument').bind('pageshow', function() { 
    $(this).wrap('<div id="temporary-instrument-wrapper">'); 
    $('#temporary-instrument-wrapper').page(); 
    $(this).unwrap(); 
}); 
+0

おかげでダン、あなたの2番目のアイデアは本当に働いた!私は 'pagehide'の動的コンテンツを削除して、既存のコンテンツに追加するだけでした(私は完全に置き換える必要がありました)、私は小さな' show'と 'hide'を適用してunstyledのフラッシュを止めました動的な値は現在更新されています。これは大変感謝しています! –

1

新しいDOMキャッシュ管理機能:デフォルト

でオンにアニメーションのページ遷移がページでは、 と1あなたにしていることを必要とするのでDOMの両方に移行している場合は、DOMにページ を追加しますnd。これまでのところ、これらのページは が完全なページリフレッシュを行うまでDOMにとどまりますので、 は常に デバイスのメモリ天井に達し、ブラウザが減速したりクラッシュする可能性があります。

Beta 2では、DOMをきれいに保つための簡単なメカニズムを追加しました。それは のように動作します:ページがAjax経由で読み込まれるたびに、 (技術的にはページの隠れページ)に移動すると、DOMからの削除のフラグは となります。削除したページに戻った場合は、 ブラウザがそのファイルをキャッシュから取得できる可能性があります。または、必要に応じて をサーバーから再要求します。ネストされたリストの場合、 は、リストの一部ではないページ に移動すると、ネストされたリストを構成するすべてのページを削除します。 マルチページ設定に含まれているページは、この機能の影響を受けません.Ajaxによって取り込まれた ページのみがjQuery Mobileによってこのように管理されます。 domCache呼ば

新しいページのオプションは、それらをキャッシュする方法(物事が働いていた方法)として、DOM内のページ を残したり、 クリーンDOMを維持し、隠されたページ(新しい方法)を削除するかどうかを制御します。デフォルトでは domCacheはfalseに設定され、DOMサイズをアクティブに管理します。 をtrueに設定した場合は、DOMを自分で管理し、ある範囲のデバイスで のテストを徹底する必要があります。

選択ページをキャッシュ するために、個々のページにdomCacheオプションを設定するには、ページのコンテナに =「true」属性をデータ-DOM-キャッシュを追加したり、このようにプログラム的にそれを設定することができ、次のいずれか

elem.page({ domCache: true }); 

domCacheオプションは、グローバルに設定することもできます。これは、もともとやったようにそれが動作するように、背面に DOMキャッシュを有効にする方法である:

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

Phillさん、ありがとうございました。私はブログ記事を読んで、jQuery Mobileの私のバージョンを更新しましたが、私のアプリケーションには何の効果もありませんでした。それは私がそれを書いた方法でなければならない - 私は少し深く掘る必要があると思う。ありがとうanyhoo! –

+0

'data-dom-cache =" false "'私の 'div'の助け! – Andrew

0

私はこの単純な解決策の問題ことを修正しました:

ランダムで別のパラメータを追加します。 http://www.yourdomain.com/ws.php?opcion=1&**cache_hack=" +Math.random();**

ランダムになりますと最後のパラメータのようなあなたのURLに番号「diferente」コールとjqueryの携帯電話はcache.-ません

また、あなたのPHPスクリプトに追加:

`header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); 
header("Cache-Control: no-cache"); 
header("Pragma: no-cache");` 
+0

それは確かに動作しますが、私はSEOがそれを好きだとは思わない(あなたがインターネットページをやっているなら)。 –

+0

jajajajajいいえ、それは本当です;) – Vousys

関連する問題