Javascript 复选框选中需要输入，如果复选框未选中不需要输入

这是我的html

    <input type="checkbox" name="checked" id="check" onclick="unlocking()">
    <label for="checkbox">If checked</label>
    <fieldset id="unlock" style="display:none;">
        <input type="text" name="Name" value="Name" id="inside" required>
        <input type="text" name="email" value="email" id="inside" required>
        <input type="text" name="Adress" value="Adress" id="inside" required>
      </fieldset>

---

如果显示字段集，我希望输入是必需的，如果不只是跳过它。

您可以遍历每个子项，并根据复选框是否选中，将其

required

属性设置为

true

或

false

，如下所示：

for (child of form.children) {
  child.required = true;
}

请检查下面的代码段：

函数解锁（）{
var checkBox=document.getElementById（“检查”）；
var form=document.getElementById（“解锁”）；
如果（复选框。选中）{
form.style.display=“block”；
for（形式的孩子。孩子）{
child.required=true；
console.log（子级）；
}
}否则{
form.style.display=“无”；
for（形式的孩子。孩子）{
child.required=false；
console.log（子级）；
}
}
}

如果检查

//element.setAttribute（“必需的”，“必需的”）；需要打开的开关
//元素。删除属性（“必需”）；需要关闭的开关
函数解锁（）{
var checkBox=document.getElementById（“检查”）
var form=document.getElementById（“解锁”）
var inputs=document.querySelectorAll（'input[type=text]'））
如果（复选框。选中）{
form.style.display=“block”；
对于（变量i=0；i

这种方式有效，如果我刷新页面并单击“提交”按钮，则该页面无效（需要字段），我需要选中并取消选中“不需要字段”复选框。是否有解决方案？是的，我已更新了答案。您所要做的就是从HTML元素中删除

required

属性。请让我知道这是否解决了您的问题。

for (child of form.children) {
  child.required = true;
}

//element.setAttribute("required", "");    turns required on
//element.removeAttribute("required");     turns required off


function unlocking() {
    var checkBox = document.getElementById("check")
    var form = document.getElementById("unlock")
    var inputs = document.querySelectorAll('input[type=text]')

    if(checkBox.checked) {
       form.style.display="block";
       for(var i = 0; i < inputs.length; i++)
       inputs[i].setAttribute("required", "");
    }else {
       form.style.display="none";
       for(var i = 0; i < inputs.length; i++)
       inputs[i].removeAttribute("required");
    }
}