HTML5のラジオボタンをCSSでdisplay:none;すると、An invalid form control with name=’~’ is not focusable.エラー

HTML5のラジオボタンをCSSでdisplay:none;すると、An invalid form control with name=’~’ is not focusable.エラー

HTML5でラジオボタンをCSSでカスタマイズして、本来のラジオボタンをdisplay:none;にすると、Chromeのコンソール上で「An invalid form control with name=’~’ is not focusable.」エラーが発生していました。

このエラーが発生するのはラジオボタンにrequiredを指定しているためで、requiredを外すもしくはopacity: 0;に変更することで対応可能です。

opacityに変更することで表示されているものの透明なのでデザインも問題なく、エラーも発生しなくなりました。requiredによるエラーメッセージは少しズレるので調整が必要です。

スポンサーリンク
  • このエントリーをはてなブックマークに追加
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA