2012-01-13 5 views
1

である私はマルチページテンプレートページは内部のページを表示するボタンがあり、複数ページのテンプレートページ(page2.aspxjQueryのモバイル:マルチページテンプレートのロードが、死ん

をロードする単一のページのテンプレートページ(page1.aspx)を持っていますダイアログとして。 page1がデフォルトのAJAX動作でpage2をロードすると、ページ2のボタンは機能しません。ブラウザにpage2の更新を強制すると、page2のボタンが機能します。

ページ1のリンクにdata-ajax="false"を追加すると、すべて問題ありません。

AJAX経由で複数ページのテンプレートページを読み込んでボタンを動作させるにはどうすればよいですか?

答えて

5

AJAX経由で複数ページのドキュメントにリンクすることはできません。最初のdata-role="page"要素のみがDOMにインポートされ、それ以外は無視されます(<head>のコンテンツでさえも)。

AJAXなしで複数ページのテンプレートにリンクすると、ページ全体が読み込まれ、data-role="page"要素がすべて利用可能になります。

<script src="jquery.js"></script> 
<script> 
$(document).bind('mobileinit', function() { 
    $.mobile.ajaxEnabled = false; 
}); 
</script> 
<script src="jquery-mobile.js"></script> 

UPDATE:あなたはまた、このように世界的には、このオプションを設定することができます

<a hef="#" rel="external">my link</a> 

<a hef="#" data-ajax="false">my link</a> 

またはこのような:これを行うには、このような特定のリンクの属性を設定することができます

私はあなたにdあなたが欲しいものはありますが、私はそれを見つけることができませんでした。それはちょうど最初のものではなく、複数ページの文書からすべてのdata-role="page"要素を引っ張り出します(ただし、これは奇妙なディープリンクの問題を引き起こします)。バージョン1.0で

UPDATE

ああ、それは良いものだ:)

、jQueryのモバイルは、あなたがリンクにdata-prefetch="true"属性を追加することでページをプリフェッチできるようになります。複数ページのテンプレートを別々のページに分割すると、それらをプリフェッチしてDOMに追加できるようになり、リンクがクリックされると(「AJAXリクエストが解決されるのを待つのではなく)」「即座に」表示されます。 。プリフェッチ用

ドキュメント:http://jquerymobile.com/demos/1.0/docs/pages/page-cache.html

+0

あなたの複数ページのテンプレートから1ページをリロードするとにかくはありますか?例:file1にはページ#Aと#Bがあります。ページを隠すときは、ページ#AをDOMから削除し、ページ#がページ#Bにある場合は同じページに移動します。ページ#Aに戻ると、ページがリロードされますが、ページ#Bへのリンクはもう機能しません。何らかの方法がありますか、それともテンプレートを分割するのが最善ですか? – mvdb

+1

この状況では、テンプレートを2つの別々のファイルに分割するのが最善です。リフレッシュによって訪問者の経験が損なわれないように、各文書にすべてのJSファイルとCSSファイルを含めることを忘れないでください。これを複数ページのテンプレートで行うには、AJAXを使用する必要があります(同じドキュメントの別のコピーを取得するために)。また、別のファイルを使用すると、ページから離れて移動すると、自動的にDOMから削除されます。 – Jasper

+0

ページを分割することはやりました。ありがとうございました。 – mvdb

関連する問題