JQuery Mobile:以编程方式插入Button的样式并不适用

时间:2011-11-16 14:30:26

标签: css listview button jquery-mobile

我在ListView中插入了一个JQueryMobile按钮。当按钮被硬编码时,jquerymobile的css样式适用。但是当我尝试以编程方式插入按钮时,样式丢失了。如何将JQueryMobile的css重新应用到按钮?

让大家知道我在说什么,这是我在ListView上插入项目的代码

//CODE TO ADD A JAVASCRIPT BUTTON TO THE LIST
var parent = document.getElementById("group-1");
var listItem;
listItem = document.createElement('li');
listItem.setAttribute('id',"group-1-row-0");
var inner=    "<a href=\"#\" style=\"padding-top:0px;padding-left:0px;padding-bottom:0px\">";
inner = inner + "<div class=\"customTableLayout\">";
inner = inner +       "<fieldset data-role=\"fieldcontain\" id=\"ui-softbutton\">";
inner = inner +            "<input type=\"button\" id=\"ui-softbutton\" value=\"SOFTCODED\" />";
inner = inner +       "</fieldset>";
inner = inner + "</div>";
inner = inner + "</a>";
listItem.innerHTML = inner;
parent.appendChild(listItem);

//WHEN YOU TRY TO ENABLE THIS CODE, THE DISPLAY BECOMES WEIRD
//$("#ui-softbutton").button();
//$("#ui-softbutton").button('refresh');

$(parent).listview("refresh");

查看此代码的结果并看到HARDCODED按钮有效,请参阅此JFiddle

1 个答案:

答案 0 :(得分:2)

直播示例:

只需附加触发器('create')方法

$(parent).listview("refresh").trigger('create');