如何通过JS来控制勾选了第一个框，后面2个勾选的框为灰色的？

sadfoo2019

如何通过JS来控制勾选了第一个框，后面2个勾选的框为灰色的，同理其他2个类似，请教下各位，谢谢？  框住的的那个位置的html代码如下：

[HTML] 纯文本查看 复制代码

 <p style="text-align: left;">
                    <span style="font-size: 14px;"><span style="font-family: 宋体;"><span style="font-family: 宋体; font-size: 16px;"><span style="font-family: 宋体; font-size: 16px;"><span style="font-size: 14px;"><span style="font-family: 宋体;">第一次<input name="DATA_117" title="第一次" type="checkbox"/>   <span style="font-size: 14px;"><span style="font-family: 宋体;">第二次<input name="DATA_120" title="第二次" type="checkbox"/>  第三次及以上<input name="DATA_121" title="第三次" type="checkbox"/></span></span></span></span></span></span></span></span>
                </p>

根据各位大佬的提示，已经搞定，非常感谢！！！！！！！！

netcsk

  <label><input type="checkbox" name="HLDJ" id="HLDJ1" class='form-control' value="特级护理" data-redio="@@1:" />特级护理</label>
                                    <label><input type="checkbox" name="HLDJ" id="HLDJ2" class='form-control' value="一级护理" data-redio="@@2:" />一级护理</label>
                                    <label><input type="checkbox" name="HLDJ" id="HLDJ1" class='form-control' value="二级护理" data-redio="@@1:" />二级护理</label>
                                    <label><input type="checkbox" name="HLDJ" id="HLDJ2" class='form-control' value="三级护理" data-redio="@@2:" />三级护理</label>


var CheckRedio = function () {
    try {
        $('input[type="checkbox"][data-redio*="@"]').each(function () {
            var $thisRedio = $(this);
            var RedioName = $thisRedio.attr('name');
            $('input[name="' + RedioName + '"]').each(function () {
                $(this).change(function () {
                    var checkThis = $(this);
                    var checkInput = $("input[name='" + this.name + "'][id!='" + this.id + "']:checked");
                    if ($(this)[0].checked && checkInput.length > 0 && checkInput.eq(0).attr('data-redio') != $(this).attr('data-redio')) {
                        $('input[name="' + RedioName + '"]').each(function () {
                            if (!IsNull(checkThis.attr('data-redio'))&&checkThis.attr('data-redio').indexOf(':') > 0) {
                                 $.each(checkThis.attr('data-redio').split(':'),function (i,e) {
                                        if (i!=0) {
                                            $('#' + e).css("display", "none");
                                            $('#' + e).val('');
                                            $('#' + e).find('input').val('');
                                        }
                                    });
                            }
                            $(this)[0].checked = false;
                            $(this).parent().removeClass('checked')
                            $(this).prop('checked', false);
                        });
                        $(this)[0].checked = true;
                        $(this).parent().addClass('checked')
                        $(this).prop('checked', true);
                    }
                });
            });
        });
    } catch (e) {

    }
   
}

陌上纤虹

老哥，去csdn问吧

zd404039009

name属性设成一样即可

fan1191237272

// 获取name="DATA_117"的input框，var inputs=        document.getElementsByName("DATA_117");
if(inputs.checked) {
document.getElementsByName("DATA_120").disabled = true;
document.getElementsByName("DATA_121").disabled = true;
}

主要还是看你的input标签有没有唯一标识，唯一标识会不会变

lies2014

要做单选，为什么不用radiobutton实现呢，分到同一组就可以单选了

zhou773

发出来全部的 没法确定你这是 表单还是 自己写的dom  

jiumiwang

获取Dom这三个元素, for一下,他们三绑定点击事件, 点击时候 这个this为true 其他为false,在写个类名让他们换成灰色,

jiumiwang

jiumiwang 发表于 2021-10-20 11:13
获取Dom这三个元素, for一下,他们三绑定点击事件, 点击时候 这个this为true 其他为false,在写个类名让他们 ...

为false时候, 俩个为false同时添加class,

brightwill

？？为什么不用单选框？<label><input name="DATE" type="radio" value="" />第一次 </label>
<label><input name="DATE" type="radio" value="" />第二次</label>
<label><input name="DATE" type="radio" value="" />第三次及以上</label>