Atribute ng Form ng HTML

Ang kabanata na ito ay nagpapakilala sa HTML <form> Iyong iba't ibang attribute ng elemento.

Attribute na Action

action Ang attribute na ito ay nagtatalaga ng operasyon na gagawin kapag isusubmit ang form.

Karaniwang, kapag tinatanggap ng server ang datos ng form, pagpindot ng gumagamit sa button na "Submit".

Sa mga sumusunod na halimbawa, ang datos ng form ay ipapadala sa file na may pangalang "action_page.php". Ang file na ito ay naglalaman ng server-side script na papatrabaho sa datos ng form:

实例

Pagkatapos ng pagsumite, ang datos ng form ay ipapadala sa "action_page.php":

<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="Bill"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Gates"><br><br>
  <input type="submit" value="Submit">
</form>

亲自试一试

Mga paalala:Kung iwasan ang paggamit ng attribute na action, ang action ay gagamitin ang kasalukuyang pahina.

Attribute ng Target

target Ang attribute ay nagtutukoy saan ipapakita ang tugon pagkatapos isumite ang form.

target Ang attribute ay maaaring itakda ang sumusunod na halaga:

Halaga 描述
_blank Ang tugon ay ipapakita sa bagong window o tab.
_self Ang tugon ay ipapakita sa kasalukuyang window.
_parent Ang tugon ay ipapakita sa magulang na framework.
_top Ang tugon ay ipapakita sa buong body ng window.
framename Ang tugon ay ipapakita sa pinangalanan na iframe.

Ang default na halaga ay _self, ibig sabihin na ang tugon ay magbukas sa kasalukuyang window.

实例

Dito, ang naisumite na resulta ay magbukas sa bagong tab ng browser:

<form action="/action_page.php" target="_blank">

亲自试一试

Attribute ng Method

Ang attribute ng method ay nagtutukoy ng HTTP method na gagamitin kapag isinasumite ang data ng form.

Ang data ng form ay maaaring maging URL variable (gugamitin method="get") o bilang HTTP post transaction (gugamitin method="post") ay magpadala.

Ang default na HTTP method ay GET kapag isinasumite ang data ng form.

实例

Ang halimbawa na ito ay gumagamit ng paraan ng GET para sa pagsumite ng data ng form:

<form action="/action_page.php" method="get">

亲自试一试

实例

Ang halimbawa na ito ay gumagamit ng paraan ng POST para sa pagsumite ng data ng form:

<form action="/action_page.php" method="post">

亲自试一试

Mga paalala tungkol sa GET:

  • Idagdag ang data ng form sa URL sa anyo ng pares ng pangalan/salapi (gugamitin)
  • Huwag kailanman gamitin ang GET para sa pagpapadala ng sensitibong data! (Ang isinumite na data ng form ay makikita sa URL!)
  • Ang haba ng URL ay may hangganan (2048 na character)
  • Kapaki-pakinabang para sa pagsumite ng form na nilalayong idagdag bilang bookmark ng user
  • GET ay ginagamit para sa hindi ligtas na data, gaya ng query string sa Google

Mga paalala tungkol sa POST:

  • Idagdag ang data ng form sa laman ng HTTP request (hindi na ipapakita sa URL ang isinumite na data ng form)
  • Wala ng hangganan ang sukat ng POST, maaring gamitin para sa pagpapadala ng malaking dami ng data.
  • Ang pagsumite ng form na may POST ay hindi makakadagdag ng bookmark

Mga paalala:Kung ang data ng form ay naglalaman ng sensitibong impormasyon o personal na impormasyon, siguraduhing gamitin ang POST!

Attribute ng Autocomplete

autocomplete Ang attribute ay nagtutukoy kung dapat ba ang form ay magbukas ng awtomatikong pagpuna.

Pagkatapos pinagana ang awtomatikong pagpuna, ang browser ay magpapunta ng base sa mga naunang ipinasok na halaga ng user.

实例

Pinagana ang form sa awtomatikong pagpuno:

<form action="/action_page.php" autocomplete="on">

亲自试一试

Novalidate 属性

novalidate 属性是一个布尔属性。

如果已设置，它规定提交时不应验证表单数据。

实例

未设置 novalidate 属性的表单：

<form action="/action_page.php" novalidate>

亲自试一试

所有 <form> 属性的列表

属性 描述
accept-charset 规定用于表单提交的字符编码。
action 规定提交表单时将表单数据发送到何处。
autocomplete 规定表单是否应打开自动完成（填写）功能。
enctype 规定将表单数据提交到服务器时应如何编码（仅供 method="post"）。
method 规定发送表单数据时要使用的 HTTP 方法。
name 规定表单名称。
novalidate 规定提交时不应验证表单。
rel 规定链接资源和当前文档之间的关系。
target 规定提交表单后在何处显示接收到的响应。