如何使用HTML指定計算繫結到的表單元素？

HTML 的 label 標籤允許我們點選標籤，這將被視為點選了相應的輸入型別。HTML可以接受幾種輸入型別，例如單選按鈕或複選框。for 屬性指定標籤繫結的表單元素。

語法

<label for="element_id"> Label Content </label>

以下是一些示例……

示例

在下面的例子中，如果我們點選“學生”，相應的單選按鈕將被選中，從而增加選擇區域。這是透過 for 屬性實現的。

<!DOCTYPE html>
<html>
<body>
   <h1>Click On Labels To Select Radio Button</h1>
   <form>
      <label for="Student">Student</label>
      <input type="radio" name="Category" id="Student" value="Student" />
      <br />
      <label for="WorkingProfessional">
         Working Professional
      </label>
      <input
         type="radio"
         name="Category"
         id="WorkingProfessional"
         value="WorkingProfessional"/>
      <br />
      <label for="Retired">Retired</label>
      <input type="radio" name="Category"
      id="Retired" value="Retired" />
      <br />
      <br />
      <input type="submit" value="Submit" />
   </form>
</body>
</html>

輸出

當指令碼執行時，視窗將在瀏覽器中開啟，其中包含不同的標籤，每個標籤前面都有一個單選按鈕，以便在選中時增加其選擇區域。

示例

另一個使用 for 屬性的例子如下所示：

<!DOCTYPE html>
<html>
<body>
   <p>Education:</p>
   <form action="">
      <label for = "graduate">Graduate</label>
      <input type = "radio" name = "education" id = "graduate" value = "graduate"><br>
      <label for = "ugraduate">Under-graduate</label>
      <input type = "radio" name = "education" id = "ugraduate" value = "ugraduate"><br>
      <input type = "submit" value = "Submit">
   </form>
</body>
</html>

輸出

執行上述指令碼後，獲得的輸出如下：

更新於：2022年9月5日

瀏覽量：116