1

これは簡単な質問ですが、何かおかしなことが起こっているようです。私は Django を使用しており、任意のページ ビューで現在のメッセージを表示する jQuery モバイル ダイアログを開きたいと考えています。ダイアログを閉じた後、ウィンドウは表示しようとしていたページを返す必要があります。したがって、実際の問題は、ページの読み込み時にダイアログを開き、ページを表示する方法です。

これ（多くのバリエーション）は機能しません：

{% if messages %}
<section class="dialog" id="messagesDialog" data-role="dialog" data-theme="a">
<header class="okay" data-role="header"><h1>This is a title</h1></header>
<div data-role="content">
    <ul>
        {% for message in messages %}
        <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
        {% endfor %}
    </ul>
</div> {# content #}
</section>

<script type="text/javascript">
$(document).one('pageinit', function(event) {
    $.mobile.changePage("#messagesDialog", 'pop', true, true);
});
</script>
{% endif %}

しかし、これは：

{% if messages %}
<section class="dialog" id="messagesDialog" data-role="dialog" data-theme="a">
<header class="okay" data-role="header"><h1>This is a title</h1></header>
<div data-role="content">
    <ul>
        {% for message in messages %}
        <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>
        {% endfor %}
    </ul>
</div> {# content #}
</section>

<script type="text/javascript">
$(document).one('pageinit', function(event) {
    $.mobile.changePage("WhatHeck?!?!"); // This will return a 500 error from the server
    $.mobile.changePage("#messagesDialog", 'pop', true, true);
});
</script>
{% endif %}

それで、これは既知の問題ですか、それとも私が見逃しているものですか? ページを取得してダイアログをポップし、それを閉じた後に正しいページを表示できる唯一の方法は、$.mobile.changePage()ダイアログに変更する前にエラーを発生させるために呼び出すことです。

===追加===

エラーなし、ダイアログなし、正しいページ:

$("section@[data-role=page]").one('pagechange', function(event) {
    //$.mobile.changePage("WhatHeck?!?!");
    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

エラーなし、ダイアログを開く、間違ったページ:

$(document).one('pagechange', function(event) {
    //$.mobile.changePage("WhatHeck?!?!");
    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

/WhatHeck?!?! を要求しているサーバーからの 500 エラー (予想)、ダイアログが開き、正しいページ:

$(document).one('pagechange', function(event) {
    $.mobile.changePage("WhatHeck?!?!");
    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

エラーなし、ダイアログを開く、間違ったページ:

$(document).one('pagechange', function(event) {
    $.mobile.changePage($("section@[data-role=page]"));
    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

エラー: 「Uncaught TypeError: 未定義のメソッド '_trigger' を呼び出せません」、ダイアログなし、正しいページ:

$(document).one('pagechange', function(event) {
    $.mobile.changePage($("section@[data-role=page]",{
        changeHash : true
    }));

    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

エラーなし、ダイアログを開く、間違ったページ:

$(document).one('pagechange', function(event) {
    $.mobile.changePage("#Home");
    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

実際に動作します！

$(document).one('pagechange', function(event) {
    $.mobile.changePage("#Home", {
        allowSamePageTransition : true
    });

    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

また動作します (任意のページの場合):

$(document).one('pagechange', function(event) {
    $.mobile.changePage($("section@[data-role=page]"), {
        allowSamePageTransition : true
    });

    $.mobile.changePage("#messagesDialog",{
        transition : 'pop',
        reverse    : false,
        changeHash : true
    });
});

だから私の問題の解決策は、この質問への答えです:エラーページの読み込みに失敗したときにjqueryモバイル状態で何が起こっていますか?

そのため、pagechange イベント ハンドラー内から changePage を呼び出すと、履歴がまだ更新されていないように見えます。現在のページを強制的にリロードしてからダイアログを開く必要があることは、まだ意味がありません。これは、サーバーからのエラーを予期するよりも、少なくとも優れたソリューションです。

4

1 に答える 1

1

古いバージョンの jQuery Mobile の構文を使用しているようです (エラーが発生するのはそのためです)。それ以降に jQuery Mobile を使用している場合は1.0a4.1、次のページを参照してください: http://jquerymobile.com/demos/1.1.0/docs/api/methods.html

上記のドキュメント リンクの構文を使用すると、コードは次のようになります。

$(document).one('pageinit', function(event) {
    $.mobile.changePage($("#messagesDialog"), {
        transition : 'pop',
        reverse    : true,
        changeHash : true
    });
});

jQuery Mobile を使用している場合は1.0a4.1、アップグレードしてください。この時点で 1 年前のものであり、(最新の 1.1.0 ビルドと比較して) 特に安定しておらず、機能も豊富ではありません。

于 2012-04-23T18:14:13.473 に答える