检测伪类：从javascript无效

Question

有没有办法通过Javascript检测:invalid元素上的伪类input的“外观”？

换句话说，当:invalid元素出现在input元素上时，如何触发某些Javascript代码运行？

Answer 1

有一个无效的事件，你可以听取。

  

当检查了submittable元素并且不满足其约束时，将触发无效事件。在提交所有者表单之前，或者在调用元素或其所有者表单的checkValidity（）之后，检查提交元素的有效性。

https://developer.mozilla.org/en-US/docs/DOM/Mozilla_event_reference/invalid

您还可以访问一些属性来检查元素的有效性，如果这更多是您所追求的。

  

.validity.valid

     

元素符合所有约束验证，因此被认为是有效的。

https://developer.mozilla.org/en-US/docs/DOM/ValidityState

编辑：自从我回答这个问题以来，我已经学到了一些东西......

.validity.valid实际上是约束Constraint Validation API的一部分，对它的支持最多只有spotty，这太糟糕了（该API中有很多很棒的东西）

但是，似乎运行良好的是querySelectorAll(':invalid')，它返回当前无效的所有表单元素的非实时NodeList。您可以在表单元素上调用addEventListener('change' ..等等，并在触发时查询validty。