-1

ページ（ビュー）を動的に作成および変更するMVC js lib（emberjs）を使用しています。jQuery Mobileを使用して手動でページ作成をトリガーするにはどうすればよいですか？

これが私のjsFiddleです-http ://jsfiddle.net/mattkime/Aczye/3/

ヘッダーとフッターを含むjQueryMobileページが作成されます。1秒のsetTimeoutの後、そのページはDOMから削除され、新しいコンテンツが挿入されますが、表示に失敗します。失敗したコードが表示されます。

（ルーティングは残り火によって処理されるためオフになっていることに注意してください）

新しいマークアップをjQueryMobileの拡張ページとして表示するにはどうすればよいですか？

コード：

/** disables jQM routing **/
$(document).bind("mobileinit", function () {
    $.mobile.ajaxEnabled = false;
    $.mobile.linkBindingEnabled = false;
    $.mobile.hashListeningEnabled = false;
    $.mobile.pushStateEnabled = false;
});

// removes hidden pages
$('div[data-role="page"]').live('pagehide', function (event, ui) {
    $(event.currentTarget).remove();
});


var pageTwo = '<div id="pageTwo" data-role="page"><div data-role="header"><h1>header2</h1></div> <div data-role="content">...</div><div data-role="footer" data-position="fixed"><h1>footer2</h1></div></div>';

setTimeout(function(){
    $('#pageOne').remove();
    $('body').append(pageTwo);
    $('#pageTwo').page();
    //alert($('#pageTwo').length);
    //$.mobile.changePage($('#pageTwo'));
},1000);

</ p>

4

1 に答える 1

2

ページ 1 を削除しないでください。そうしないと、そこからページ 2 に移行できなくなります。

http://jsfiddle.net/Aczye/4/

/** disables jQM routing **/
$(document).bind("mobileinit", function () {
    $.mobile.ajaxEnabled = false;
    $.mobile.linkBindingEnabled = false;
    $.mobile.hashListeningEnabled = false;
    $.mobile.pushStateEnabled = false;
});

// removes hidden pages
$(document).delegate('div[data-role="page"]', 'pagehide', function (event, ui) {
    $(event.currentTarget).remove();
});


var pageTwo = '<div id="pageTwo" data-role="page"><div data-role="header"><h1>header2</h1></div> <div data-role="content">...</div><div data-role="footer" data-position="fixed"><h1>footer2</h1></div></div>';

setTimeout(function(){
    //$('#pageOne').remove();
    $('body').append(pageTwo);
    $.mobile.changePage("#pageTwo");
    //alert($('#pageTwo').length);
    //$.mobile.changePage($('#pageTwo'));
},1000);

編集：.delegate将来の保証のために使用するように更新されました。一部の jQuery モバイル バージョンでは.bind、古いバージョンの jquery がまだ必要です。

于 2012-08-14T20:40:49.073 に答える