web-dev-qa-db-ja.com

入力type = "email"

メールアドレスを尋ねるフォームがあります。通常私は使用します

<input type="email" ...>

しかし、ユーザーが[email protected]メールアドレスを使用している場合（おそらく）@mycompany.comではなくfooを入力できるようにしたいと思います。検証を回避する方法はありますか（形式がこの正規表現に一致する場合は受け入れ、そうでない場合は通常に検証する）、または単に使用する

<input type="text" ...>

セマンティクスなどを無視しますか？

html5forms
1
Charles

有効な電子メールアドレスの形式 tにないコンテンツを許可する場合は、前述のように<input type="text" ...>を使用します。誰かmay電子メールアドレス全体を入力しますが、そのフィールドに限定されないため、<input type="email" ...>を使用することは適切ではありません。

ブラウザにこれらのフィールドを検証させたくない場合は、フォーム検証をオフにすることもできます。しかし、そのようなことはHTML5機能を使用する目的に反します。

5
John Conde

HTML5 では、pattern=""属性を 指定 にできます。

UAがその要素によって表されるコントロールの値を確認するための正規表現を指定します。

[ECMA 262]で指定されているJavaScriptパターンの生成に一致する必要がある正規表現。

例：

<input type="email" pattern="[^ @]*@[^ @]*" value="">

<input type="email" id="email" name="email" placeholder="Enter your email address" pattern="^[A-Za-z0-9](([_\.\-]?[a-zA-Z0-9]+)*)@([A-Za-z0-9]+)(([\.\-]?[a-zA-Z0-9]+)*)\.([A-Za-z]{2,})$">

しかし、私はtype="text"を使用してより安全な側にいます。この場合、任意のユーザー入力を検証できます。

2
LazyOne

新しいHTML5 pattern 属性を使用して、JavaScript正規表現を使用して入力フィールドに有効な形式を指定し、title属性にエラーメッセージを入れることができます。

<input type="email" pattern="([regexp])" title="Your error message" />

ただし、説明するシナリオでは、Mobile Safariユーザーが完全なqwertyキーボードの代わりに電子メールキーボードを見るという事実を除いて、type="text"を使用するよりもこの方法で行う利点はあまりありません。

そのため、会社の住所を使用し、テキストフィールドの後にプレーンテキストで追加し、完全なバージョンではなくメールアドレスの最初の部分をユーザーに要求することを要件とすることを検討できます。

2
Nick