сделать скрытое поле ввода "действительным"

Question

Почему скрытый ввод не считается «действительным» селектором jquery и что я могу с этим сделать (т.е. сделать его действительным).

console.log($("#a").is(":valid")); // true
console.log($("#b").is(":valid")); // false

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="a" type="text" value="abc">
<input id="b" type="hidden" value="def">

Answer 1

Согласно MDN :

Скрытые входные данные не участвуют в проверке ограничений; у них нет реального значения, которое можно было бы ограничить.

И, как таковые, не будут получать псевдоклассы valid или invalid. На ум приходит несколько вариантов: либо отфильтровать коллекцию, чтобы исключить hidden входные данные, либо использовать эту проверку в качестве обходного пути:

$("#b").is(":not(:invalid)");

Answer 2

console.log($("#a").is(":valid")); // true
console.log($("#b").is(":valid")); // false

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="a" type="text" value="abc">
<input id="b" type="text" style="display:none" value="def">

Измените тип со скрытого на текстовый, затем используйте CSS, чтобы изменить свойство display на none