我修改了一个小小提琴来演示我目前遇到的问题 http://jsfiddle.net/TPxT7/。基本上我需要textboxes
有漂亮的jQuery Mobile
风格,但不管我有什么refresh
或trigger
似乎什么都没有改变。可折叠的东西总是动态创建的。
如果链接有问题,我会附上代码:
HTML:
<div id="medListDiv" data-role="collapsible-set" data-theme="e" data-content-theme="e" style="padding:10px;">
</div>
脚本(抱歉缺少缩进):
$(function() {
var key, value;
var Storage = 5
// loop through local storage
for (var i = 0; i < Storage; i++) {
// retrieve the key
key = i;
// set the field from the key
value = "Medicine" + i.toString();
//$("#medListDiv").show();
var text = '<div data-role="collapsible" data-collapsed="true" data-iconpos="right">' + '<h2>' + value + '</h2>' + '<input type="text" placeholder="Quantity" />' + '<textarea cols="40" rows="4" placeholder="Type any directions written on your prescription for the above medicine." ></textarea></div>';
$("#medListDiv").append(text);
}
$('#medListDiv').find('div[data-role=collapsible]').collapsible();
//$('.ui-collapsible-set').collapsible("refresh");
//$("#medListDiv").trigger("create");
//$('.ui-collapsible-set').trigger("create");
});
正如您在底部看到的那样,我尝试添加以下代码位(不是一次全部):
$('.ui-collapsible-set').collapsible("refresh");
$("#medListDiv").trigger("create");
$('.ui-collapsible-set').trigger("create");
而且我也尝试遵循this question上的一些答案,但似乎没有任何区别,也许我错过了一些东西,但我似乎无法解决这个问题。
为了让事情更清楚,我希望它看起来像我在静态模式下创建的这个Fiddle 。
任何建议或想法将不胜感激。