电子邮件是互联网上的一种工具,我们可以使用电子邮件地址向他人发送正式电子邮件。有很多电子邮件服务提供商,如 Yahoo、Gmail、Hotmail 等。我们需要向这些服务提供商注册,以便获得自己选择的电子邮件地址。电子邮件地址由两部分组成——用户名和域名。用户名可以由大写或小写字母、数字、特殊字符和点组成。用户名的最大长度最多为 64 个字符,域名的最大长度为 253 个字符。用户名和域名始终用“@”符号分隔。我们在很多地方输入电子邮件 ID,您一定已经观察到网页始终接受有效地址。
在 HTML 表单中,我们创建“email”类型的单行输入控件。一旦使用类型邮件,它会自动检查电子邮件地址的有效性。电子邮件地址的验证确实非常重要,否则用户也可能输入错误的电子邮件地址。虽然它不会检查整个电子邮件地址,但它只检查 @ 和 TLD 扩展名,即顶级域。
让我们了解如何在HTML中使用电子邮件。
<html> <body> <form name="form1"> <label for="sub">Enter your e-mail id : </label> <input type="email"> <br><br> <input type="submit" value="Submit"> </form> </body> </html>
在这个程序中,如果用户没有输入正确的电子邮件地址格式,它将显示错误消息。
我们还可以使我们的电子邮件控件接受多个电子邮件地址。例如,当我们撰写电子邮件时,我们可以在“收件人”、“抄送”和“密送”字段中键入多个地址。因此,如果您还想制作这样一个允许输入多个电子邮件地址的控件,那么您可以使用 MULTIPLE 属性。
示例
让我们看一个例子来阐明这个概念。
<html> <body> <form name="form1"> <table> <tr> <td> <label for="to">To </label> </td> <td> <input type="email" multiple> </td> </tr> <tr> <td> <label for="cc">Cc </label> </td> <td> <input type="email" multiple> </td> </tr> <tr> <td> <label for="bcc">Bcc </label> </td> <td> <input type="email" multiple> </td> </tr> <tr> <td></td><td> <textarea rows="10" cols="50"> </textarea></td> </tr> <tr> <td></td> <td> <input type="submit" value="Submit"></td> </tr> </table> </form> </body> </html>
在“收件人”或“抄送”或“密件抄送”字段中,我们可以使用逗号(,)输入多个收件人的电子邮件地址
假设在您的网站上,您想要对电子邮件地址的字符数量设置限制,那么可以使用标签中的MINLENGTH和MAXLENGTH属性。MINLENGTH将指定电子邮件地址可以接受的最小字符数,而MAXLENGTH将限制电子邮件地址中的最大字符数。
<html> <body> <form name="form1"> <label for="sub">Enter your e-mail id : </label> <input type="email" minlength="15" maxlength="25"> <br><br> <input type="submit" value="Submit"> </form> </body> </html>
输入内容不能超出限制,一旦超过限制,光标将停止输入。
要设置电子邮件控件的默认值,这意味着默认电子邮件 ID 将出现在电子邮件文本字段中(使用 VALUE 属性),而不是空白文本字段。您还可以使用 REQUIRED 属性将其设为必填字段。
<html> <body> <form name="form1"> <label for="sub">Enter your e-mail id : </label> <input type="email" value="abc@gmail.com" required> <br><br> <input type="submit" value="Submit"> </form> </body> </html>
如果留空,将会显示错误。
假设,在网站中,需要显示可以输入电子邮件地址的格式,以便用户可以轻松地以正确的格式输入。为此,可以创建占位符。
<html> <body> <form name="form1"> <label for="sub">Enter your e-mail id : </label> <input type="email" placeholder="abc@gmail.com"> <br><br> <input type="submit" value="Submit"> </form> </body> </html>
最后,让我们讨论模式属性,使用该属性我们可以限制输入仅特定域的电子邮件地址。它不会接受其他域的电子邮件地址。
<html> <body> <form name="form1"> <label for="sub">Enter your e-mail id : </label> <input type="email" pattern=".+@gmail\.com"><br> <input type="submit" value="Submit"> </form> </body> </html>
根据这个程序,只允许使用gmail地址。
以上是如何在HTML中使用电子邮件输入类型?的详细内容。更多信息请关注PHP中文网其他相关文章!