入力へのアクセス方法：必須：jQueryを使用していませんか？

Question

HTML5を使用して書式を検証しています。無効または焦点を当てる：入力要素が必要な場合は、私が判断することができますどのように、今

input:required:invalid, input:focus:invalid { 
    color: red; 
} 

：私の入力フィールドが必要で、かつ無効であるのであれば、私は次のコードを使用していることを反映するために、CSSスタイルを変更することができます。 jQueryを使用して無効ですか？このような

何か：

if ($('#myInput') has the attribute invalid) { Do something } 

明らかに、if文の条件が条件である必要があります。私はこれをどのように把握できますか？ありがとう！

Answer 1

フィルタ内にネイティブcheckValidity()を使用することができます。 `：invalid

var invalidInputs = $('#myForm :input').filter(function() { 
 
    return !this.checkValidity(); 
 
}).each(function() { 
 
    console.log(this.name, ' error message is ', this.validationMessage) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="myForm"> 
 
    <input name="noValidation"> 
 
    <input name="required_w_value" value="test" required> 
 
    <input name="required_no_value" required> 
 
</form>