form-control类不允许在html中隐藏文本框。

Question

级别 form-control 在HTML中不允许隐藏文本框，我试了一下这样的方法。

<input type="number" name="mfi_nam9" class="text1 form-control" id="mfi_name" hidden>

但它不工作，除了当我删除form-control

我想在以下代码中使用它

<table>
<?php
for($count=0;$count<=2;$count++)
{
 echo"<tr>
    <td>
      <input type=\"checkbox\" name=\"sd3\" value=\"mfi_nam9\" class=\"checkme\" />
    </td>
    <td>First Value</td>
    <td>
      <input type=\"number\" name=\"mfi_nam9\" class=\"text1 required form-control\" id=\"mfi_name\" hidden>
    </td>
    <td></td>
  </tr>";
}
  ?>

</table>



<script>
[].forEach.call(document.querySelectorAll('.checkme[type="checkbox"]'), function(elem) {
  elem.addEventListener('change', function() {
    this.parentNode.parentNode.querySelector('.text1[type="number"]').hidden = !this.checked;
  });
})
</script>

Answer 1

你可以用... display: none; 或 visibility: hidden 代替id

.text1 {
   display: none !important;
}

或

.text1 {
   visibility: hidden !important;
}

似乎你在for循环中的很多元素都使用了相同的id。