JS控制HTML取消所有Radio的选择，并不可选择。

来源：互联网发布：vb读取excel数据编辑：程序博客网时间：2024/04/30 05:11

需求：有选项1和选项2两个radio，如果点击选项1可以选择子radio选项，点击选项2则清空子radio的选项。

HTML代码：

<div class="col-xs-12">    <label class="control-label" style="font-weight:bold">肢体形态：</label>    <label class="control-label">    <input type="radio" name="Shapes" value="1" />正常    </label>    <label class="control-label">    <input type="radio" name="Shapes" value="2" />异常    </label></div><div class="col-xs-12">    <label class="radio-inline">    <input type="radio" name="ShapesUnusual" value="1" />畸形    </label>    <label class="radio-inline">    <input type="radio" name="ShapesUnusual" value="2" />缺失    </label>    <label class="radio-inline">    <input type="radio" name="ShapesUnusual" value="3" />肿胀    </label>    <label class="radio-inline">    <input type="radio" name="ShapesUnusual" value="4" />萎缩    </label>    <label class="radio-inline">    <input type="radio" name="ShapesUnusual" value="5" />痉挛    </label>    <label class="radio-inline">     <input type="radio" name="ShapesUnusual" value="6" />存在部位    </label>    <input class="" id="ShapesUnusualPart" /></div>

JS代码：

function radioChanging (name, childName, value) {   $("input[name="+ name +"]").change(function () {       if ($('input[name="' + name + '"]:checked ').val() == value) {          $("input[name=" + childName + "]").each(function () {             $(this).attr("checked", false);             $(this).attr("disabled", true);          })   } else {         $("input[name=" + childName + "]").each(function () {            $(this).attr("disabled", false);         })    }  })}

最后再jQuery的ready方法中使用这个方法监听目标元素。

radioChanging('Shapes', 'ShapesUnusual', 1);

参数为

父级radio的Name
子级radio的name
点击后会被清空的radio的value

0 0