HTML
<label for="i1"><input type="radio" name="r1" id="i1" value="未接种" />未接种</label> <label for="i2"><input type="radio" name="r1" id="i2" value="部分接种" />部分接种</label> <label for="i3"><input type="radio" name="r1" id="i3" value="接种完成" />接种完成</label>
javascript
var r = document.getElementsByName("r1"); for (let i = 0; i < r.length; i++) { if (r[i].checked == true) { // 当前是被选中的,r[i].value是被选中的值,赋值给指定参数就是了。 this.checked = r[i].value; } }
拓展
1.判断是否有选项被选中,次判断用于不设定默认值场景使用
if(r[0].checked == false && r[1].checked == false && r[2].checked == false){ alert("请选择新冠疫苗注射情况!"); return false; }
2.配合label使用,可增加用户可操作性,方便使用;label的for属性和input的id绑定,点击label即触发input。
<label for="i1"><input type="radio" name="r1" id="i1" value="未接种" />未接种</label> <label for="i2"><input type="radio" name="r1" id="i2" value="部分接种" />部分接种</label> <label for="i3"><input type="radio" name="r1" id="i3" value="接种完成" />接种完成</label>