$(document).ready(function(){ }); に jquery-mobile の 2 つの折りたたみ可能なものを追加しています。
このように見えます
$(document).ready(function() {
var l_freeCollabsible=fCreateCollapsible("Free", "Free Content");
var l_bestSellCollabsible=fCreateCollapsible("Best Sellers", "Best Selling Content");
var l_frag = document.createDocumentFragment();
l_frag.appendChild(l_freeCollabsible);
l_frag.appendChild(l_bestSellCollabsible);
document.body.appendChild(l_frag);
});
fCreateCollapsible() は次のようになります
function fCreateCollapsible(heading,content){
var l_collapsible = fDomCrElemTypeTheme("div","collapsible","b","b");
l_collapsible.setAttribute("data-iconpos","right");
var l_heading = fDomCrElemText("h4",heading);
var l_content = fDomCrElemText("span",content);
apc(l_collapsible,l_heading);
apc(l_collapsible,l_content);
return l_collapsible;
}
この関数は次の構造を作成します
<div data-role="collapsible" data-theme="b" data-content-theme="b" data-iconpos="right">
<h4>Heading</h4>
<span>
Content
</span>
</div>
私の問題は、Dom ready が呼び出された後、必要に応じて要素が作成されるが、それらが隠されていることです。
要素作成コードを入れてボディ内から関数を呼び出して関数を作ってみました。それは完全に機能します。
ready関数にjqueryスタイルを適用する方法はありますか? body タグの空のペアを使用して、すべての要素を動的に作成したいと考えています。jqm+phonegap で簡単なモバイル アプリケーションを作成しようとしています。
jquery-mobile-1.3.2 と jquery-1.9.1 を使用しています。