2

PHPを使用してクエリ文字列の内容を確認し、ヘッダー、コンテンツ、フッターをレンダリングして適切なページを読み込むMVC Webアプリケーションがあります(たとえば、?category = 1はカテゴリビューをレンダリングするCategoryControllerを読み込みます)。

DOMの要素にjQuery機能を追加するcustom.jsもあります。動的コンテンツはPHPによって制御されるため、jQuery機能はページが最初にロードされたときにのみ機能します。アプリケーションをトラバースしてもページは更新されないため、新しく含まれる要素はjQueryオブジェクトに追加されません。

これを回避する方法について何かアイデアはありますか?

4

1 に答える 1

1

まず、jQuery Mobileで$(function()または$(document).ready()を使用しないでください。これは、jQMがそのように機能するように構築されていないためです。代わりに、https ://stackoverflow.com/に記載されているページイベントを使用する必要があります。 a /14010308/1848600または次のようなmobileinitイベント:

$(document).on("pageinit", function () {

});

または、アプリの実行時に1回だけ実行する場合は、mobileinit:

$(document).on("mobileinit", function () {

});

理由はトップリンクに記載されています。また、これについて詳しくは、jQMの公式ドキュメントをご覧ください:http://jquerymobile.com/test/docs/api/events.html

ここで、jQMでページのスタイルを変更する場合は、.trigger('pagecreate')関数を使用する必要があります。

たとえば、IDインデックスを持つjQMページがあり、これが生成されたレイアウトであるとします。

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <a href="#" data-role="button" id="test-button">Test button</a>
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>  

jQMにスタイルを強制するには、次のようなものを使用する必要があります。

$('#index').live('pagebeforeshow',function(e,data){    
    $('#index').trigger('pagecreate');
});

または、すべてのjQMページに適用する場合は、次のように使用します。

$('[data-role="page"]').live('pagebeforeshow',function(e,data){    
    $(this).trigger('pagecreate');
});
于 2013-01-21T15:44:04.697 に答える