電子郵件是網路上的一種工具,我們可以使用電子郵件地址向他人發送正式電子郵件。有許多電子郵件服務供應商,如 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中文網其他相關文章!