HTML 表單

1. 簡介表單

HTML 表單是一個重要的工具，可以用來讓用戶與網頁互動。透過表單，可以收集用戶資訊，比如文字、選項、檔案或其他數據， 這些資訊可以發送到伺服器進行處理。HTML 表單透過多種元素創建，每個元素都針對特定的數據輸入類型。 表單的主要容器是 <form>，其內包含其他元素，例如 <input>、 <textarea>、<button>、<select> 等等。

表單的主要元素

表單元素可以創建輸入欄位、按鈕、下拉選單和其他界面元素，用戶可以通過這些控件輸入數據。以下是表單中常用的標籤：

• <form> — 為所有表單元素的主要容器，定義數據發送的目標和方式。
• <input> — 通用元素，用於創建各種輸入欄位（文字、密碼、單選、複選框等）。
• <label> — 與輸入欄位相關聯的元素，用於描述其用途。
• <textarea> — 多行文字輸入框。
• <button> — 按鈕，用於提交表單或執行其他操作。
• <select> 和 <option> — 下拉列表，用戶可以從中選擇一個或多個選項。

簡單表單範例

      
    <form action="/submit" method="post">
      <label for="name">名字:</label>
      <input type="text" id="name" name="name">
      
      <label for="email">電子郵件:</label>
      <input type="email" id="email" name="email">
      
      <button type="submit">提交</button>
    </form>
    

          
<form action="/submit" method="post">
  <label for="name">名字:</label>
  <input type="text" id="name" name="name">
  
  <label for="email">電子郵件:</label>
  <input type="email" id="email" name="email">
  
  <button type="submit">提交</button>
</form>

• action 中的 <form> 定義了表單數據發送的 URL。
• method 指定數據的提交方式：post 或 get。

HTML <input>

標籤 <input> 是表單中最多功能的元素之一。它支援不同的輸入類型，適用於處理各種類型的數據。

標籤的語法 <input>:

<input type="類型" name="欄位名稱" id="識別碼" value="值">

<input type="類型" name="欄位名稱" id="識別碼" value="值">

在 <input> 中使用的屬性：

• type — 輸入類型（例如，文字、密碼、email 等）。
• name — 欄位名稱，伺服器用來辨識數據。
• id — 唯一識別碼，用於與 <label> 關聯。
• value — 預設顯示在欄位中的值（例如，預設文字）。