输入的表单和所需的电子邮件类型

Question

当我创建一个需要输入的表单时：

<form action="" id="FormMessage"  method="post" >
    <div style="max-width:700px;">
                    <input name="InputEmail" id="InputName" class="email" type="text" width="100%" placeholder="Your email" required>
            <div style="padding-top:20px">
                <button id="BtMessage" class="btn btn-primary">Send</button>
            </div>
    </div>
 </form>

如果未填写，我们会收到此警告消息：

在未填写电子邮件的情况下尝试单击“发送”按钮的示例：http://jsfiddle.net/c9b47j9j/

有什么方法可以得到同样的消息，但是如果填写的不是电子邮件？

Answer 1

然后您需要将输入 type="text" 更改为 type="email"。然后它会将字段自动验证为 EMAIL。但请记住，这只是 HTML 5 次验证。

如果您想使用更多额外的验证，您需要使用 JS 或 jQuery 插件，或者自己编写。下面是一些 jQuery 表单验证插件链接::

Answer 2

您可以使用以下内容。默认情况下它将验证电子邮件。无需代码。

<input type='email' />

Answer 3

这是因为你在

中写了"required"

<input name="InputEmail" id="InputName" class="email" type="text" width="100%" placeholder="Your email" required>`

这实际上是 Chrome、Firefox、Safari、IE 版本 9+ 和 Edge 中的 HTML 验证关键字。

如果您想在没有此警报的情况下验证空字段验证，请删除 "required" 关键字并改用 JavaScript 代码。

Answer 4

而不是输入类型='text'，使用输入类型='email'。这将验证用户是否输入了有效的电子邮件地址。

现在所有主流浏览器都支持此功能：

http://caniuse.com/#search=type%3Demail

实现此目的的另一种方法是使用模式属性应用正则表达式：

https://www.w3schools.com/tags/att_input_pattern.asp

Answer 5

你用过

type='text' 但你需要使用这个 type='email'

输入的表单和所需的电子邮件类型

Form and required email type for input

forms

jquery

email-validation

twitter-bootstrap