Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính method của Form trong HTML

Thuộc tính method của thẻ <form> định nghĩa cách gửi dữ liệu form: dưới dạng biến URL (GET) hoặc giao dịch HTTP POST (POST).

Cú pháp

<form method="get | post"></form>

Giá trị

  • get (mặc định): Gửi dữ liệu qua URL, hiển thị trên thanh địa chỉ. Phù hợp dữ liệu không nhạy cảm, ít dữ liệu.
  • post: Gửi dữ liệu trong body request HTTP. An toàn hơn, không giới hạn độ dài, phù hợp dữ liệu nhạy cảm (mật khẩu, upload file).

Ví dụ

<!DOCTYPE html>
<html>
<style>
  body {
    color: #000;
    height: 100vh;
    background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) no-repeat;
    text-align: center;
  }
  input {
    width: 315px;
    display: block;
    margin: 1rem auto;
    border: 2px solid #fff;
    padding: 8px;
    background: transparent;
    border-radius: 20px;
    outline: none;
  }
  ::placeholder { color: #000; }
  .btn {
    background: #db133a;
    border: none;
    height: 2rem;
    border-radius: 20px;
    width: 330px;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
    margin: 1rem auto;
  }
</style>
<body>
<h1>Demo thuộc tính method của Form</h1>
<form action="/action_page.php" method="get">
  <input type="text" name="firstname" placeholder="Nhập Tên">
  <input type="text" name="lastname" placeholder="Nhập Họ">
  <input type="submit" value="GỬI" class="btn">
</form>
</body>
</html>

Kết quả

Điền form và nhấn "GỬI". Với method="get", URL sẽ hiển thị: /action_page.php?firstname=...&lastname=...

Thử thay method="post" để thấy khác biệt: dữ liệu không hiện trên URL.