[解決済み] jQueryを使ったフォームバリデーションの手動トリガー

質問

いくつかの異なるフィールドセットを持つフォームがあります。フィールドセットを一度に1つずつユーザーに表示するjQueryを持っています。HTML5 の検証をサポートするブラウザのために、私はそれを利用したいと思います。しかし、私の条件でそれを行う必要があります。私はJQueryを使用しています。

ユーザーが次のフィールドセットに移動するためにJSリンクをクリックすると、現在のフィールドセットで検証が行われ、問題がある場合はユーザーが先に進むのをブロックする必要があります。

理想的には、ユーザーが要素へのフォーカスを失うと、検証が行われます。

現在、novalidateが動作しており、jQueryを使用しています。ネイティブメソッドを使用することを希望します。）

どのように解決するのですか？

ネイティブの検証UIを起動することができません。 (下記の編集を参照) を起動させることはできませんが、任意の入力要素でバリデーションAPIを簡単に利用できます。

$('input').blur(function(event) {
    event.target.checkValidity();
}).bind('invalid', function(event) {
    setTimeout(function() { $(event.target).focus();}, 50);
});

最初のイベントは checkValidity が発生します。 invalid であれば、対応するイベントが発生し、2番目のイベントハンドラによって捕捉されます。 これはフォーカスを要素に戻すものですが、かなり煩わしいので、エラーについて通知するためのより良い解決策を持っていると仮定します。 上記のコードの実行例です。 .

EDITです。 すべてのモダンブラウザ サポート は reportValidity() メソッドは、ネイティブ HTML5 検証のために この回答 .