单选场景不少,h5自带提供的单选控件简约规范,使用起来还是挺方便的。
就以最基本的为例,性别选择:
<form class="sexClass">
<label class="single"><input type="radio" name="sex" value="male" />男</label>
<label class="single"><input type="radio" name="sex" value="female" />女</label>
<label class="single"><input type="radio" name="sex" value="secret" />保密</label>
</form>
form中的radio必须将name属性设置为相同,单选属性才会生效。
设置默认值,只需要按name拿到input集合,然后按排序对号入座把checked属性设置为true即可。
var sexInput = document.getElementsByName("sex");
if (userInfo.sex == "男"