checkValidityを使用したHTML 5フォームの検証でデフォルトの赤/オレンジの境界線が表示されない

Question

html 5フォームの検証を使用する私はajaxを使用して取得するフォームを検証したいと考えています。

私のフォーム（.checkValidity()を使用）を検証すると、firefox/chromeを使ったデフォルトの無効な赤/橙色の境界線は表示されません。

input[type="submit"]をクリックすると、この赤い枠が表示されます。

は、例えば、このjsfiddleを参照してください：私が間違っているが、私はあなたがまだ自分でスタイリングCSSをしなければならないということだと思います場合

http://jsfiddle.net/jyaHZ/

Answer 1

は私を修正します。 HTML5がここに追加するのはthisのように使用できる:invalidと:valid疑似クラスです。

MDN

EDITでHTML5フォーム検証の

詳細情報：デフォルトでは

は、Geckoは適用されます。それは、hereを述べているよう

は、どうやら私は自分自身を修正することができます赤色の「グロー」を作成するスタイル（ ボックスシャドープロップを使用）擬似クラス）を持つアイテムの周りにこの擬似クラス が適用されます。 がどのようにデフォルトのスタイルを上書きするかを示す例については、：invalid pseudo-classを参照してください。

が、I - あまりにも -