Javascript 选中复选框后禁用复选框

我正在使用JSF和Javascript

复选框

<h:selectBooleanCheckbox onclick="handlePaymentButtons()" 
class="chkBox"></h:selectBooleanCheckbox>Yes I agree terms and Conditions

是，我同意条款和条件

JS

<script>
            function handlePaymentButtons(){
                console.log("we are here..");

                var box = document.getElementsByClassName("chkBox");
                box.disabled =true;
                console.log(box);
                gButton.enable();

            }
        </script>

函数handlePaymentButtons（）{
log（“我们在这里…”）；
var-box=document.getElementsByClassName（“chkBox”）；
box.disabled=true；
控制台日志（框）；
gButton.enable（）；
}

我只想禁用当前选中的复选框

---

但我仍然可以选中/取消选中复选框

这是一个

HTMLCollection

，一个集合，返回值为

getElementsByClassName

。您需要遍历它，或者从集合中按索引获取特定的元素。由于集合的

.length

为

1

，因此只需对

框[0]进行编码即可。disabled=true

或者，您也可以使用

querySelector

，它只返回一个元素（如果有）：

---

这是一个

HTMLCollection

，一个集合，返回值为

getElementsByClassName

。您需要遍历它，或者从集合中按索引获取特定的元素。由于集合的

.length

为

1

，因此只需对

框[0]进行编码即可。disabled=true

或者，您也可以使用

querySelector

，它只返回一个元素（如果有）：

---

替代解决方案看起来很棒，正是我需要的。替代解决方案看起来很棒，正是我需要的。

var box = document.querySelector(".chkBox");
box.disabled = true;