5

JqueryモバイルHTML5ページ内でページの更新を検出することは可能ですか？

私はクライアントプロジェクトの一部としてクイズを作成しています-クイズは1つのhtmlページ内のjquerymobiledivページをナビゲートします。たとえば、ユーザーがindex.html＃quizpage3にいて更新された場合、更新を検出したいと思います。ナビゲーションをindex.htmlに戻します。

これは可能ですか？

乾杯ポール

4

6 に答える 6

3

これが私が取り組んでいるソリューションです。これを書いている時点では、ttは正常に機能しているように見えるので、誰かを助けるかもしれません。ただし、これは簡単な修正にすぎず、機能を向上させるには、サーバー側で行うのが最善です。

最初に; このコードはJQMコードの前に配置されていることに注意してください。（JQM Webサイトから：mobileinitイベントはすぐにトリガーされるため、jQuery Mobileをロードする前にイベントハンドラーをバインドする必要があります。」）現在のページのハッシュを取得しますが、一部を更新したくありません。ホームページのようなページ。

<script type="text/javascript">
        var needRedirect = false;
        $(document).bind("mobileinit", function(){
            var thisPage = location.hash;
            if (thisPage != '' && thisPage != '#homepage' && thisPage != '#page1') {
                needRedirect = true;
            }
        });
    </script>
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>

そして、あなた自身のコードの最初に：

if (needRedirect) {
    $.mobile.changePage("#homepage");
    needRedirect = false;
}
于 2012-05-06T17:54:26.813 に答える
1

これは始まりです。別のページに移動するたびに、更新コンソールログを取得する必要があります。

JS

$("div:jqmData(role='page')").live('pagehide',function(){
    console.log('page refreshed, redirect to home');
    $.mobile.changePage( "#home", { transition: "slideup"} );
});​

HTML

<div data-role="page" id="home">
    <div data-role="content">
        Hello Refresh
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">Home</li>
            <li><a href="#page2">Page 2</a></li>
        </ul>
    </div>
</div>

<div data-role="page" id="page2" data-theme="a">
    <div data-role="content">
        Hello Page 2
        <ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="a">
            <li data-role="list-divider">Page 2</li>
            <li><a href="#home">Home</a></li>
        </ul>
    </div>
</div>​

たぶん、別のイベントの方がうまくいくでしょう：

于 2012-04-20T13:15:42.780 に答える
1

私の答えはPatchの答えと似ていますが、$（document）.ready行の前のローカル参照jsファイルの先頭に以下を追加するだけでした。また、私が信じるヘッダーのどこにでもHTMLスクリプトタグに追加することができます。

if (location.hash != "" && location.hash != "pageHome") {
    var url = location.href;
    url = url.replace(location.hash,"");
    location.replace(url);
}
于 2013-05-18T00:35:11.957 に答える
0

$(function() {});メソッド（ページの読み込み時にのみ実行される）でURLを取得し、 ＃が含まれている場合はホームページにリダイレクトできます。

編集：またはwindow.onload = function ...純粋なJSの代替として使用します。

于 2012-04-20T10:20:31.840 に答える
0

私は少し遅れていますが、非常に単純なソリューションを作成するというPatchのアイデアを実行しました。$（document）.ready（）の前にスクリプトタグまたはJSファイルでこれをスローします

checkPage();

function checkPage() {
    var _hash = location.hash;

    if (_hash != '' && _hash != "#home") {
        var _url = location.href.replace(_hash, "");
        window.location.href = _url;
    }
}
于 2014-01-30T09:00:19.083 に答える
0

私は、これはもっと簡単だと思います

$(document).on("pagebeforeshow", function() {
    window.location = "page";
});
于 2016-01-15T03:18:41.477 に答える