0

ページ数が少ないhtmlファイルがあり、ユーザーが特定のページのボタンを押すと、結果を含むページを含む新しいhtmlファイルをロードしています。ページの読み込みは問題なく機能します。問題は、新しいhtmlの新しいページ間を移動できないことです。ブラウザに手動でページをロードすると、完全に機能します。

誰もがなぜ何か考えを持っていますか？ロードが完了した後、ページに対して一種の更新アクションを実行する必要があると思いますが、ページがリモートサーバーからデータを取得するため、そうするつもりはありません。更新アクションが実行されるかどうかはわかりません。リモートサーバーからデータを再度取得してみてください（これにより、ユーザーが回答を得るまで待機する時間が重複します）。

これは私が使用するコード行です：$。mobile.changePage（ "menu.php？q =" + query、{transition： "slide"}）;

ありがとうございました

4

2 に答える 2

0

... the problem is that i can't manage to navigate between the new pages in the new html.

この行は、リモートURLリンクの複数ページのテンプレートを返そうとしていると私に信じさせます（つまり、押したリンクは同じドキュメントの疑似ページにリンクせず、別のドキュメントにすべて一緒にリンクします）。これは、jQuery Mobileではデフォルトでは許可されていません（機能のプラグインを見つけることができると思います）。jQuery Mobileは、返された外部ドキュメントから最初の要素data-role="pageまたは要素のみを取得します。data-role="dialog"

単一ページのテンプレートを使用することもできます。この場合、各単一の疑似ページは独自のドキュメントに含まれ、通常のURL（ "/contact-us/index.php"など）を介して各テンプレートにリンクします。

また

必要なすべてのページを1つのドキュメントに配置し、それらの間をハッシュベースのリンク（「#home」など）でリンクできます。これを行う場合でも、データベースからデータを取得できますが、AJAXを介して取得するためのコードを作成する必要があります（ほとんどの場合、ページイベントにバインドします）。

また

多分これのためのプラグインがあります。そうでない場合は、実際に作成するのはそれほど難しいことではありません。jQueryMobileに外部data-role="page"要素を実行させるのではなく、自分で外部要素を取得し、それらをすべてDOMに追加してから、通常のように最初の要素に移行する必要があります。

アップデート

複数の疑似ページを一度にロードする場合は、次のことを試してください。

//hijack link clicks on links with the `click-hijack` class
$(document).on('click', '.click-hijack', function () {

    //show loader
    $.mobile.loading('show');

    //create AJAX request for pseudo-page(s)
    $.ajax({
        url      : $(this).attr('href'),
        dataType : 'html',
        success  : function (response) {

            //hide loader
            $.mobile.loading('hide');

            //get the pseudo-page(s) from the AJAX response
            var $pages = $(response).find('[data-role="page"], [data-role="dialog"]');

            //append the pseudo-page(s) to the DOM
            //(this may need to change if you are using a framework like ASP.NET as they can add wrapper DOM elements)
            $("body").append($pages);

            //now that the pesueo-page(s) is/are in the DOM, we can transition to them normally
            $.mobile.changePage('#' + $pages.eq(0).attr('id'));
        },
        error    : function () {
            //don't forget to handle errors
        }
    });

    //stop the default behavior of the link, as well as propagation of the click event
    return false;
});

注：このコードはテストされていません。コードを使用するときは、これを考慮してください。

于 2012-12-11T20:36:37.280 に答える
0

デフォルトでは、jQuery Mobileでajaxを介して外部ページにリンクすると、 jQuery Mobileは最初のページのみをプルするdata-role="page"か、見つからない場合はコンテンツを取得してdata-role ="page"divでラップします。

ajaxなしでページにリンクする（リンクに追加する）ことで、外部の複数ページのドキュメントにリンクできdata-ajax="false"ます。

ajaxを介して一度に複数のページをロードする場合は、@ Jasperが提案するようなものを使用して手動でロードするか、その目的のために特別に作成されたjQuery-Mobile-Subpage-Widgetを使用できます。

于 2012-12-12T03:16:01.403 に答える