Question

我正在尝试获取某些复选框的ID，并根据情况将其设置为“禁用”。但是，我在“ Add：767 Uncaught TypeError：无法读取null的属性'disabled' 在HTMLInputElement.el.addEventListener.event（Add：767）”。为什么返回null？我不是通过ID获取元素吗？

这是JS：

    var days = 0;
    const checkboxMonthElement = document.querySelectorAll('.checkboxMonth');
    const checkboxDofmElement = document.querySelectorAll('.checkboxDofM');


    var test123 = document.getElementById('#Schedule_DofMInfo_27__IsChecked');

    checkboxMonthElement.forEach(el => el.addEventListener('change', event => {

        days = 0;

        for (var i = 0; i < checkboxMonthElement.length; i++) {


            var NofD = parseInt($(checkboxMonthElement[i]).attr('data-test'));

            if (checkboxMonthElement[i].checked) {
                if (days < NofD)
                    days = NofD;
            }
        }
        console.log(days);

        if (days = 28) {
            console.log("Days is 28");
            console.log(test123);

           document.getElementById('#Schedule_DofMInfo_27__IsChecked').disabled === true;
        }





    }));

这是HTML：

   <li class="list-group-item" style="display:inline-block">
                    <div class="checkbox-inline" id="checkboxDofM">
                        <input data-val="true" data-val-number="The field DofMID must be a number." data-val-required="The DofMID field is required." id="Schedule_DofMInfo_26__DofMID" name="Schedule.DofMInfo[26].DofMID" type="hidden" value="26" />
                        <input class="checkboxDofM" data-val="true" data-val-required="The IsChecked field is required." id="Schedule_DofMInfo_26__IsChecked" name="Schedule.DofMInfo[26].IsChecked" type="checkbox" value="true" /><input name="Schedule.DofMInfo[26].IsChecked" type="hidden" value="false" />
                        <label for="Schedule_DofMInfo_26__IsChecked">27</label>
                    </div>
                </li>
                <li class="list-group-item" style="display:inline-block">
                    <div class="checkbox-inline" id="checkboxDofM">
                        <input data-val="true" data-val-number="The field DofMID must be a number." data-val-required="The DofMID field is required." id="Schedule_DofMInfo_27__DofMID" name="Schedule.DofMInfo[27].DofMID" type="hidden" value="27" />
                        <input class="checkboxDofM" data-val="true" data-val-required="The IsChecked field is required." **id="Schedule_DofMInfo_27__IsChecked"** name="Schedule.DofMInfo[27].IsChecked" type="checkbox" value="true" /><input name="Schedule.DofMInfo[27].IsChecked" type="hidden" value="false" />
                        <label for="Schedule_DofMInfo_27__IsChecked">28</label>
                    </div>
                </li>
                <li class="list-group-item" style="display:inline-block">
                    <div class="checkbox-inline" id="checkboxDofM">
                        <input data-val="true" data-val-number="The field DofMID must be a number." data-val-required="The DofMID field is required." id="Schedule_DofMInfo_28__DofMID" name="Schedule.DofMInfo[28].DofMID" type="hidden" value="28" />
                        <input class="checkboxDofM" data-val="true" data-val-required="The IsChecked field is required." id="Schedule_DofMInfo_28__IsChecked" name="Schedule.DofMInfo[28].IsChecked" type="checkbox" value="true" /><input name="Schedule.DofMInfo[28].IsChecked" type="hidden" value="false" />
                        <label for="Schedule_DofMInfo_28__IsChecked">29</label>
                    </div>
                </li>
                <li class="list-group-item" style="display:inline-block">
                    <div class="checkbox-inline" id="checkboxDofM">
                        <input data-val="true" data-val-number="The field DofMID must be a number." data-val-required="The DofMID field is required." id="Schedule_DofMInfo_29__DofMID" name="Schedule.DofMInfo[29].DofMID" type="hidden" value="29" />
                        <input class="checkboxDofM" data-val="true" data-val-required="The IsChecked field is required." id="Schedule_DofMInfo_29__IsChecked" name="Schedule.DofMInfo[29].IsChecked" type="checkbox" value="true" /><input name="Schedule.DofMInfo[29].IsChecked" type="hidden" value="false" />
                        <label for="Schedule_DofMInfo_29__IsChecked">30</label>
                    </div>
                </li>
                <li class="list-group-item" style="display:inline-block">
                    <div class="checkbox-inline" id="checkboxDofM">
                        <input data-val="true" data-val-number="The field DofMID must be a number." data-val-required="The DofMID field is required." id="Schedule_DofMInfo_30__DofMID" name="Schedule.DofMInfo[30].DofMID" type="hidden" value="30" />
                        <input class="checkboxDofM" data-val="true" data-val-required="The IsChecked field is required." id="Schedule_DofMInfo_30__IsChecked" name="Schedule.DofMInfo[30].IsChecked" type="checkbox" value="true" /><input name="Schedule.DofMInfo[30].IsChecked" type="hidden" value="false" />
                        <label for="Schedule_DofMInfo_30__IsChecked">31</label>
                    </div>
                </li>
        </ul>
        <div class="checkbox-inline">
            <input id="checkAllDofm" name="checkAll" onclick="toggleDofM(this);" type="checkbox" value="true" /><input name="checkAll" type="hidden" value="false" />
            <label for="Select_All">Select All</label>
        </div>
    </div>
</center>

Answer 1

这是因为使用getElementById时在ID中包含“＃”，这不是必需的，并且会导致getElementById查找其ID确实包含“＃”的元素。所以不要做

document.getElementById('#Schedule_DofMInfo_27__IsChecked')

改为执行此操作：

document.getElementById('Schedule_DofMInfo_27__IsChecked')

Answer 2

您应该使用

$('#Schedule_DofMInfo_27__IsChecked').attr("disabled", true);

或

document.getElementById('Schedule_DofMInfo_27__IsChecked').disabled === true; // (without the dash)

获取某些复选框的ID并禁用它们

2 个答案: