我正在尝试获取一些动态创建的单选复选框,以便为其应用完整样式。
他们目前正在应用单独的单选框对象样式,但是它们缺少整个复选框样式的样式。
我使用this作为解决问题的方法,但 JQuery Mobile v1.4.2 和 v1.1.1 之间似乎存在差异 - 1.1.1自动应用分组样式,而1.4.2需要其他字段。
我尝试过.checkboxradio("refresh");
之类的一些内容,但它们似乎都与.trigger("create");
做同样的事情。
以下是我的代码段的完整版本:
HTML:
<div data-role="page" data-title="First Time" id="firstTime">
<div class="ui-content">
<form id="firstTimeSelectCampus">
<fieldset data-role="controlgroup" id="firstTimeSelectCampusFieldset">
</fieldset>
</form>
<p>
You can change this under the settings menu.
</p>
<a href="#" id="firstTimeButton" class="ui-btn">Continue</a>
</div>
</div>
JS:
var checked;
$("#firstTimeSelectCampusFieldset").children().remove();
$("#firstTimeSelectCampusFieldset").append("<legend>Select your default campus:</legend>");
for (var i = 0; i < campusArray.length; i++ ) {
if (i === 0) {
checked = ' checked="checked" ';
}
else {
checked = "";
}
$("#firstTimeSelectCampusFieldset").append(
'<input ' +
'type="radio" ' +
'name="campus" ' +
'id="' + campusArray[i].id + '" ' +
'value="' + campusArray[i].id + '" ' +
checked +
'>' +
'<label for="' + campusArray[i].id + '"' + '>' +
campusArray[i].name +
'</label>'
);
};
$("#firstTime").trigger("create");
这就是我想要的样子:
目前的情况如下:
这是问题的真正最小化版本(试图摆脱不必要的一切):http://jsfiddle.net/tbLSk/
那里有很多类似的问题,但是我还没有能够让任何解决方案100%工作,所以我假设我错过了一些非常明显的问题。
答案 0 :(得分:1)
你忘记了课程btn-group-vertical
<div data-role="page" id="firstTime">
<div id="lel" class="ui-content">
<fieldset data-role="controlgroup">
<div id="firstTimeSelectCampusFieldset" class="btn-group-vertical" data-role="controlgroup">
</div>
</fieldset>
</div>
</div>
或:
<div data-role="page" id="firstTime">
<div id="lel" class="ui-content">
<div class="btn-group-vertical" data-role="controlgroup">
<fieldset id="firstTimeSelectCampusFieldset" data-role="controlgroup">
</fieldset>
</div>
</div>
</div>