チャリ通勤になりつつあるjyunzyです。
歩きより早いし、車よりも手軽に乗れるのがいいですね。 おかげで寄り道も増えました(笑)
今回は「HTML5のフォーム属性でチェック機能を追加」についてお話します。
inputタグにrequired（必須）の属性を追加すると、空欄のままフォームを送信すると「このフィールドは入力必須です。」と言った警告が表示されます。
また、メールアドレスの欄に「type=”email”」を使い、正しくない状態でフォームを送信しようとすると「メールアドレスが正しくありません。」と言ったような警告が表示されます。
これらは、ブラウザごとに表示される内容が変わります。
INTERNET EXPLORER 11でメール送信をしようとした場合
・required（必須）を付けたフィールドに「これは必須フィールドです」と表示
・type=”email”を付けたフィールドに「有効な電子メールアドレスを入力してください」と表示
Chrome68でメール送信をしようとした場合
・required（必須）を付けたフィールドに「このフィールドを入力してください。」と表示
・type=”email”を付けたフィールドに「メールアドレスに「@」を挿入してください。「●●」内に「@」がありません。」と表示
便利ですね。 ただ、プラグインでメールフォームを作っている人の場合、プラグイン側から出す警告と上記の警告が同時に出ているかも知れませんね。
別に害はありませんが、警告のメッセージを書き換えたいという方は、混同しないように注意して下さいね。
