如果复选框被选中，则不需要输入类型

Question

我有一个几乎所有输入类型都需要的表单，例如下面的 HTML：

                <p>Name:*</p>
                  <input type="text" name="Name" required>
                <p>Company Name: </p>
                    <input type="text" name="Company_Name">
                <p>Email: *</p>
                    <input type="email" size="30" name="Email" required>
                <p>Phone:*</p>
                    <input type="text" name="Phone" required>

在表格的末尾，我有一个复选框，上面写着

                    <div class="checkbox">
                       <input type="checkbox"  name="checkbox_name[]" > 
                         <p>I'm Going</p>   
                       <input type="checkbox"  name="checkbox_name[]" >
                         <p>thanks, but I can't go</p>  

                      <input type="checkbox" name="checkbox_name[]" required>                 
                      <p>I have read the above information</p>

当且仅当 "Thanks, but I can't go" 复选框被选中时，有没有办法 "de-require" 上述输入类型？

Answer 1

看看这个。它会根据“我要去”或“不去”的复选框更改“必需属性”。您可以根据需要修改它。我希望你明白了。

<p>Name:*</p>
<input type="text" name="Name" class="formElem" required>
<p>Company Name: </p>
<input type="text" class="formElem" name="Company_Name">
<p>Email: *</p>
<input type="email" class="formElem" id="email" size="30" name="Email" required>
<p>Phone:*</p>
<input type="text" class="formElem" name="Phone" required>

<div class="checkbox">
  <input id="ckbox" type="checkbox" name="checkbox_name[]" onchange="check()">
  <p>I'm Going</p>
  <input type="checkbox" name="checkbox_name[]">
  <p>thanks, but I can't go</p>

  <input type="checkbox" name="checkbox_name[]" required>
  <p>I have read the above information</p>

  <script>
    function check() {
      var temp = document.getElementsByClassName("formElem");
      if (document.getElementById("ckbox").checked) {            
        for (var e = 0; e < temp.length; e++) { // For each element
          var elt = temp[e];
          elt.required = true;
        }
      } else {
        for (var e = 0; e < temp.length; e++) { // For each element
          var elt = temp[e];
          elt.required = false;
        }
      }
    }
  </script>

如果复选框被选中，则不需要输入类型

derequire input types if checkbox is checked

html

css

validation

checkbox

required