[form] HTML - <input type="email"> 태그 - 이메일 입력 (= 인풋이메일타입/이메일타입인풋 요소)

1. <input type="email"> 예제 - 이메일 입력
2. <input type="email"> 정의
3. <input type="email"> 구문

<input type="email"> 예제 - 이메일 입력

[단일 이메일 입력]

(예)

 

<form action="/action_page.php">

  <label for="email">단일 이메일:</label>

  <input type="email" id="email" name="email">

  <input type="submit">

</form>

 

결과보기 (전송키값쌍: email=)

---

[복수 이메일 입력]

(예) ,

 

<form action="/action_page.php">

  <label for="emails">복수 이메일:</label>

  <input type="email" id="emails" name="emails" multiple>

  <input type="submit">

</form>

 

결과보기 (전송키값쌍: emails=,)

<input type="email"> 정의

 

이메일 입력 가능한 INPUT 요소.

 

---

 

1.

• @ 포함한 올바른 이메일 형식인지 서버 전송 전 브라우저에서 자동 체크함.
• multiple 속성 추가 시, 한번에 여러 이메일을 쉼표(,)로 구분해 입력 가능. (※ 쉼표 다음에 공백 있어도 상관없음.)
• 복수 이메일 입력해 서버에 전송 시, PHP explode() 함수로 쪼개서 개발 이메일 출력 가능.
• <label> 태그 이용 시, 웹접근성 향상됨.

 

2.

모든 브라우저 지원.

 

3. MDN <input type="email"> 예제보기

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/email

 

<input type="email"> 구문

 

• 단일이메일: <input type="email">
• 복수이메일: <input type="email" multiple>