按类别禁用一组单选按钮

Disable a group of radio buttons by class

本文关键字:一组 单选按钮      更新时间:2023-09-26

当选中另一个单选按钮时,我正试图禁用同一类中的所有单选按钮。此功能适用于复选框,但当我使用单选按钮时不适用。如有任何帮助,我们将不胜感激。

https://jsfiddle.net/neilcosby123/qssvzap4/1/

function radcheck(){
var ra = document.getElementById("main")
if(ra.checked){
    $(".radioclass").prop("disabled", true);
    $(".radioclass").attr("checked", false);
}

}

在没有任何上下文的情况下很难写作(比如你为什么要这样做?)。

我想你需要的是:

$("#main").change(function() {
  var isChecked = $(this).is(":checked");
  $(".radioclass")
    .prop("disabled", isChecked)
    .prop("checked", !isChecked);
});

https://jsfiddle.net/qssvzap4/9/

$(function(){
    var $radios = $('.radioclass');
    $('#main').on('click', function(){
        $radios.prop('disabled', this.checked).prop('checked', false);
    });
});

https://jsfiddle.net/qssvzap/7/

以下是如何使用vanilla-js的方法,因为jquery并不是真正关键的,老实说,我觉得在这种情况下它太过分了。

function radcheck(){
    var ra = document.getElementById("main");
    if(ra.checked){
        var radios = document.querySelectorAll('.radioclass');
        for(var i=0;i<radios.length;i++){
           radios[i].checked = false;
           radios[i].disabled = true;
         }
    }
}

如果你想让它们切换,你可以做同样的循环,但要做:

   radios[i].checked = !radios[i].checked;
   radios[i].disabled = !radios[i].disabled;

实际上在你给定的小提琴中。您尚未链接jquery库。检查小提琴https://jsfiddle.net/stdeepak22/e9zeL6eL/1/

$(document).ready(function () {
    $('#main').click(function () {
        if ($(this).prop('checked')) {
            $(".radioclass").each(function () {
                $(this).prop("disabled", true);
                $(this).prop("checked", false);
                //$(".radioclass").attr("checked", false);
            });
        }
    })
});