4

クエリモバイルを使用して、既存のサイトのモバイルバージョンを作成しています。このサイトは、wwwバージョンで正常に機能するマークアップが確立された数百ページです。問題は、＃useername、＃map、＃photoなど、すべてのページに同じ要素IDのインスタンスが多数あることです。各ページが個別に読み込まれるため、競合が発生しないため、これはwwwでは問題ありません。JQMでは、すべてのページが何らかの形で一緒にキャッシュされており、コードが前のページを参照しているように見えます。例えば：

Page1.html

<div id="commonIdOnEveryPage">Page 1</div>
<a href="page2.html">Link</a>
<script>
alert($("#commonIdOnEveryPage").html());
</script>

Page2.html

<div id="commonIdOnEveryPage">Page 2</div>
<script>
alert($("#commonIdOnEveryPage").html());
</script>

1ページから2ページに移動するためのリンクをクリックした後も、アラートには「1ページ」と表示されます。

この例では、2ページ目のIDを簡単に変更できますが、実際のサイトでは、同じIDが使用され、JSが数千行の長さの異なるページに数百の場所があります。確かに、JQMをこれと互換性のあるものにする方法があります。

4

6 に答える 6

2

代わりに共通のクラスを使用してください。jQueryMobileは一度に複数のページをDOMに持つため、「一意の」IDは一意ではありません。

$(".ui-page-active .commonclass").html()

編集：

IDを一意にできない場合、次善の策は次のようになります。

$(".ui-page-active div[id=commonid]").html()
于 2012-07-17T18:32:30.790 に答える
2

前のページをキャッシュから削除しているように見えるが、戻るボタンとトランジションを保持しているこのコードを見つけました。

$('div').live('pagehide', function(event, ui) {
    $(event.target).remove();
});
于 2012-07-18T00:16:02.657 に答える
2

トムキンカイドの答えはプロのアドバイスです。

少しクリーンアップするだけで、1）キャッシュからすべてのdivを削除するオーバーヘッドを削減し、2）新しいJQuery規則で最新の状態にすることができます。

$(document).on('pagehide', '.ui-page', function(event, ui) {
    $(event.target).remove();
});

これで、キャッシュから前のページがクリアされ、戻るボタンの機能が保持されます。

于 2013-09-27T14:56:23.827 に答える
1

デフォルトでは、JQMのページに移動すると、フレームワークはajaxを介してページのコンテンツをロードし、それをに添付するため、DOMページごとに複数のIDが作成されます。また、ページにリンクしてhttp、問題を解決できると思われる'rel = "external" ordata-ajax = "false"`を使用して、ページが正常に読み込まれるようにすることもできます。適切なjsファイルを確認する必要があります。ただし、各ページの先頭にリンクされています。

于 2012-07-17T19:41:24.377 に答える
0

使用します：

$(document).ready(function(){
    alert('#commonIdOnEveryPage');
});

修理する？

于 2012-07-17T19:42:55.777 に答える
0

時間に基づいて一意の文字列を作成し、それをすべてのIDに追加します。

// unique string for use in DOM ids
$unique = str_replace(array(' ', '.') ,'_', microtime());

次に、html出力で：

<div id="commonIdOnEveryPage<?php echo $unique; ?>">Page 2</div>
<script>
alert($("#commonIdOnEveryPage<?php echo $unique; ?>").html());
</script>
于 2014-01-10T15:34:06.727 に答える