[英]jQuery Mobile - Change radiobutton state programmatically
Having this radio buttons in horizontal controlgroup: 将此单选按钮放在水平控制组中:
<div data-role="fieldcontain">
<fieldset data-role="controlgroup" data-type="horizontal">
<legend>Geslacht:</legend>
<input id="gender-male" name="gender" type="radio" value="MALE" />
<label for="gender-male">Man</label>
<input id="gender-female" name="gender" type="radio" value="FEMALE" />
<label for="gender-female">Vrouw</label>
</fieldset>
</div>
At a given point I want to reset the values programmatically using: 在给定的点上,我想使用以下方式以编程方式重置值:
$('#gender-male').prop('checked', false)
$('#gender-female').prop('checked', false)
However the styling of the radio buttons is not changed. 但是,单选按钮的样式不会改变。
Eg is MALE was selected it still appears selected. 例如,MALE被选中它仍然显示被选中。
Should I do some kind of refresh? 我应该做些什么的刷新?
看这个:
$('#gender-male').attr("checked",false).checkboxradio("refresh");
For the JqueryMobile 1.4 the working solution (tested) is this: 对于JqueryMobile 1.4,工作解决方案(已测试)是这样的:
(html taken from JQM 1.4 demo code) (html取自JQM 1.4演示代码)
<form><fieldset data-role="controlgroup">
<input type="radio" name="radio-choice-v-2" id="radio-choice-v-2a" value="on" checked="checked">
<label for="radio-choice-v-2a" style="font-weight: 100;">radio button A</label>
<input type="radio" name="radio-choice-v-2" id="radio-choice-v-2b" value="off">
<label for="radio-choice-v-2b" style="font-weight: 100;">radio button B</label>
</fieldset></form>
As above the radio button A is checked. 如上所述,检查单选按钮A. You want to set radio button B checked and A set to unchecked.
您要设置单选按钮B已选中且A设置为未选中。 Please note: checkboxradio( "refresh" ) goes for each radio button.
请注意:checkboxradio(“refresh”)适用于每个单选按钮。
Javascript/Jquery (taken from JQM 1.4 API documentation and readapted) Javascript / Jquery(取自JQM 1.4 API文档并重新调整)
if (radioSetting == 0) {
$( "#radio-choice-v-2b" ).prop( "checked", false ).checkboxradio( "refresh" );
$( "#radio-choice-v-2a" ).prop( "checked", true ).checkboxradio( "refresh" );
}
else {
$( "#radio-choice-v-2a" ).prop( "checked", false ).checkboxradio( "refresh" );
$( "#radio-choice-v-2b" ).prop( "checked", true ).checkboxradio( "refresh" );
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.