HTML Input form* 속성

추천 과정: <input> 이 장에서는 HTML을 소개합니다. 요소의 다른 속성

속성

input의 속성 속성. <input> 속성은

요소가 속한 폼.

예제

이 속성의 값은 그것의 <form> 요소의 id 속성과 일치해야 합니다.

HTML 폼(하지만 여전히 폼의 일부) 밖에 있는 입력 필드:
  <label for="fname">성：</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="제출">
</form>
<label for="lname">이름：</label>
<form action="/action_page.php" id="form1">

직접 시험해 보세요

<input type="text" id="lname" name="lname" form="form1">

input의 formaction formaction 속성

주석:속성이 제출할 때 입력(데이터)를 처리할 파일의 URL을 정의합니다. <form> 이 속성은 요소의 속성

formaction 속성은 다음 입력 유형에 적용됩니다: submit과 image。

예제

두 개의 제출 버튼이 있는 HTML 폼, 각각 다른 작업(action)을 가지고 있습니다:

<form action="/action_page.php">
  <label for="fname">성：</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">이름：</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="제출">
  <input type="submit" formaction="/action_page2.php" value="관리자로 제출">
</form>

직접 시험해 보세요

formenctype 속성

input의 formenctype 속성은 제출할 때 폼 데이터를 어떻게 인코딩할지 지정합니다 (method="post"의 폼에만 적용됩니다).

주석:이 속성은 <form> 요소의 enctype 속성.

formenctype 속성은 다음 입력 유형에 적용됩니다: submit과 image。

예제

두 개의 제출 버튼이 있는 폼. 첫 번째는 기본 인코딩을 사용한 폼 데이터를 전송하고, 두 번째는 "multipart/form-data" 인코딩을 사용한 폼 데이터를 전송합니다:

<form action="/action_page_binary.asp" method="post">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="제출">
  <input type="submit" formenctype="multipart/form-data"
  value="Multipart/form-data编码으로 제출">
</form>

직접 시험해 보세요

formmethod 속성

input의 formmethod 속성은 폼 데이터를 action URL에 전송할 HTTP 메서드를 정의합니다.

주석:이 속성은 <form> 요소의 method 속성.

formmethod 속성은 다음 입력 유형에 적용됩니다: submit과 image。

폼 데이터는 URL 변수로（method="get"） 또는 HTTP POST 트랜잭션으로（method="post"） 전송할 수 있습니다。

GET에 대한 주의사항:

  • URL에 이름/값 쌍의 형태로 폼 데이터를 추가합니다
  • 절대로 GET로 민감한 데이터를 전송하지 마십시오！（제출된 폼 데이터는 URL에 표시됩니다！）
  • URL의 길이는 제한됩니다（2048 개의 문자）
  • 사용자가 결과를 북마크로 추가하려는 폼 제출에 매우 유용합니다
  • GET은 비안전 데이터에 적용됩니다. 예를 들어, Google의 쿼리 문자열

POST에 대한 주의사항:

  • HTTP 요청의 본문에 폼 데이터를 추가하여 URL에 표시되지 않도록 합니다（제출된 폼 데이터가 URL에 표시되지 않습니다）
  • POST는 크기 제한이 없으며, 많은 데이터를 전송할 수 있습니다。
  • POST를 사용한 폼 제출은 북마크를 추가할 수 없습니다

훌륭한 팁:폼 데이터가 민감한 정보나 개인 정보를 포함하고 있을 경우 반드시 POST를 사용하십시오!

예제

두 개의 제출 버튼이 있는 폼. 첫 번째는 method="get"로 폼 데이터를 전송하며, 두 번째는 method="post"로 폼 데이터를 전송합니다:

<form action="/action_page.php" method="get">
  <label for="fname">성：</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">이름：</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="GET로 제출 사용">
  <input type="submit" formmethod="post" value="POST로 제출 사용">
</form>

직접 시험해 보세요

formtarget 속성

input의 formtarget 속성은 제출 폼 후에 받은 응답을 어디에 표시할지 지정하는 이름이나 키워드를 지정합니다。

주석:이 속성은 <form> 요소의 target 속성。

formtarget 속성은 다음 입력 유형에 적용됩니다: submit과 image。

예제

두 개의 제출 버튼이 있고 다른 목표 창이 있는 폼:

<form action="/action_page.php">
  <label for="fname">성：</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">이름：</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="제출">
  <input type="submit" formtarget="_blank" value="새 창/탭으로 제출">
</form>

직접 시험해 보세요

formnovalidate 속성

input의 formnovalidate 提交时不应验证 <input> 元素的属性规定。

주석:이 속성은 <form> 요소의 novalidate 속성

formnovalidate 속성은 다음 입력 유형에 적용됩니다: submit.

예제

제출 버튼이 두 개 있는 양식(검증 및 검증하지 않음):

<form action="/action_page.php">
  <label for="email">이메일을 입력하세요:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="제출">
  <input type="submit" formnovalidate="formnovalidate"
  value="검증하지 않는 제출">
</form>

직접 시험해 보세요

novalidate 속성

novalidate 속성은 <form> 속성

novalidate 속성이 설정되어 있으면, 제출 시 모든 양식 데이터를 검증하지 않도록 정의됩니다.

예제

제출 시 모든 양식 데이터를 검증하지 않도록 정의합니다:

<form action="/action_page.php" novalidate>
  <label for="email">이메일을 입력하세요:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="제출">
</form>

직접 시험해 보세요

HTML Form 및 Input 요소

태그 설명
<form> 사용자 입력을 위해 HTML 양식을 정의합니다.
<input> 입력 컨트롤 정의

모든 사용 가능한 HTML 태그의 완전한 목록을 보려면, 우리의 사이트를 방문하세요 HTML 태그 참조 매뉴얼。