Thuộc tính form* của đầu vào HTML

Chương này giới thiệu HTML <input> các khác biệt của phần tử form* Thuộc tính.

Thuộc tính form

input 的 form Thuộc tính quy định <input> Biểu mẫu mà phần tử thuộc về.

Giá trị của thuộc tính này phải bằng id của phần tử <form> mà nó thuộc về.

Mẫu

Trường nhập liệu nằm ngoài biểu mẫu HTML (nhưng vẫn là một phần của biểu mẫu):

<form action="/action_page.php" id="form1">
  <label for="fname">姓氏：</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Gửi">
</form>
<label for="lname">名字：</label>
<input type="text" id="lname" name="lname" form="form1">

Thử ngay

Thuộc tính formaction

input 的 formaction Thuộc tính quy định URL của tệp sẽ được xử lý khi gửi biểu mẫu.

Ghi chú: }}Thuộc tính này sẽ thay thế <form> phần tử thuộc tính Thuộc tính.

formaction 属性适用于以下输入类型：submit 和 image。

Mẫu

Biểu mẫu HTML có hai nút gửi với các hành động (action) khác nhau:

<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="Gửi">
  <input type="submit" formaction="/action_page2.php" value="Gửi với quyền quản trị">
</form>

Thử ngay

Thuộc tính formenctype

input 的 formenctype Thuộc tính này xác định cách mã hóa dữ liệu biểu mẫu khi gửi (chỉ áp dụng cho biểu mẫu với method="post").

Ghi chú: }}Thuộc tính này sẽ thay thế <form> thuộc tính enctype của phần tử.

formenctype 属性适用于以下输入类型：submit 和 image。

Mẫu

Biểu mẫu có hai nút gửi. Nút đầu tiên gửi dữ liệu biểu mẫu với mã hóa mặc định, nút thứ hai gửi dữ liệu biểu mẫu với mã hóa "multipart/form-data":

<form action="/action_page_binary.asp" method="post">
  <label for="fname">Tên đầu:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Gửi">
  <input type="submit" formenctype="multipart/form-data"
  value="Gửi với mã hóa Multipart/form-data">
</form>

Thử ngay

Thuộc tính formmethod

input 的 formmethod Thuộc tính này xác định phương pháp HTTP sẽ được sử dụng để gửi dữ liệu biểu mẫu đến URL action.

Ghi chú: }}Thuộc tính này sẽ thay thế <form> thuộc tính method của phần tử.

formmethod 属性适用于以下输入类型：submit 和 image。

表单数据可以作为 URL 变量（method="get"）或作为 HTTP post 事务（method="post"）发送。

关于 GET 的注意事项：

  • 以名称/值对的形式将表单数据追加到 URL
  • 永远不要使用 GET 发送敏感数据！（提交的表单数据在 URL 中可见！）
  • URL 的长度受到限制（2048 个字符）
  • 对于用户希望将结果添加为书签的表单提交很有用
  • GET 适用于非安全数据，例如 Google 中的查询字符串

关于 POST 的注意事项：

  • 将表单数据附加在 HTTP 请求的正文中（不在 URL 中显示提交的表单数据）
  • POST 没有大小限制，可用于发送大量数据。
  • 带有 POST 的表单提交无法添加书签

提示：如果表单数据包含敏感信息或个人信息，请务必使用 POST！

Mẫu

有两个提交按钮的表单。第一个使用 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>

Thử ngay

formtarget 属性

input 的 formtarget 属性指定一个名称或关键字，该名称或关键字规定在提交表单后在何处显示收到的响应。

Ghi chú: }}Thuộc tính này sẽ thay thế <form> 元素的 target 属性。

formtarget 属性适用于以下输入类型：submit 和 image。

Mẫu

有两个提交按钮且有不同目标窗口的表单：

<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="Gửi">
  <input type="submit" formtarget="_blank" value="提交到新窗口/标签页">
</form>

Thử ngay

formnovalidate 属性

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

Ghi chú: }}Thuộc tính này sẽ thay thế <form> Thuộc tính novalidate của yếu tố.

formnovalidate Thuộc tính áp dụng cho các loại đầu vào sau: submit.

Mẫu

Biểu mẫu có hai nút gửi (gửi và không gửi xác thực):

<form action="/action_page.php">
  <label for="email">Nhập email của bạn:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Gửi">
  <input type="submit" formnovalidate="formnovalidate"
  value="Gửi không xác thực">
</form>

Thử ngay

Thuộc tính novalidate

novalidate Thuộc tính là <form> Thuộc tính.

Nếu đã được thiết lập, thuộc tính novalidate quy định rằng không nên xác thực tất cả dữ liệu biểu mẫu khi gửi.

Mẫu

Định nghĩa rằng không cần xác thực bất kỳ dữ liệu biểu mẫu nào khi gửi:

<form action="/action_page.php" novalidate>
  <label for="email">Nhập email của bạn:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Gửi">
</form>

Thử ngay

Các yếu tố Form và Input HTML

Thẻ Mô tả
<form> Định nghĩa HTML biểu mẫu cho người dùng nhập.
<input> Định nghĩa điều khiển nhập.

Nếu cần danh sách đầy đủ các thẻ HTML có thể sử dụng, vui lòng truy cập Hướng dẫn tham khảo thẻ HTML。