javascript - jQuery モバイルを使用して DIV を BODY に動的に追加する

Question

本文に DIV を追加しようとしましたが、空白のページが表示されました。これは私の例です。

同じ例では、正常に動作しているため、HTML のコメントを外しました。

コード :

$("body").append('<div data-role="page"><div data-role="content">HOME</div></div>');
$("body").collapsibleset();

Answer 1

のdata-role= "page"があるため、これは機能しません。displaynone

このCSSがどこから来ているのかわかりませんが、私のように無効にすると、「ホーム」が表示されます

EDIT この CSS は jquery mobile からのものです。data-role="page"スタイルシートで cssを手動で設定してdisplay:block;jquery をオーバーライドするか、HTML で割り当てる必要さえありません。

Answer 2

ページに ID を追加し、show()jquery のメソッドを呼び出しました。出来た

$("body").html('<div data-role="page" id="myPage"><div data-role="content"><p>HOME</p> </div></div>');
$("#myPage").show();

http://jsfiddle.net/cFens/2/でフィドルをチェックしてください。

Answer 3

jsFiddlejQuery Mobile 1.1.1のような他のものをチェック解除jQuery UI 1.8.18してチェックする必要があります