提交後如何在 HTML 表單中保留下拉選擇值？

提交後保留表單值

使用HTML 表單時，通常需要在表單提交後將所選值保留在下拉元素中已保留元素提交。這確保了無縫的用戶體驗，因為先前選擇的選項仍然處於選取狀態。

實作

在 PHP 中，使用 WordPress，這可以使用 JavaScript 來擷取所選值來實作來自表單的查詢字串參數。

考慮以下HTML形式：

<form method="get" action="">
  <select name="name">
    <option value="a">a</option>
    <option value="b">b</option>
  </select>
  <select name="location">
    <option value="x">x</option>
    <option value="y">y</option>
  </select>
  <input type="submit" value="Submit" class="submit" />
</form>

JavaScript 解決方案

要在不使用if-else 結構的情況下自動更新所選值，可以使用JavaScript：

<script type="text/javascript">
  document.getElementById('name').value = "<?php echo $_GET['name']; ?>";
  document.getElementById('location').value = "<?php echo $_GET['location']; ?>";
</script>

此腳本從URL的查詢字串中會擷取選定的值，並將它們設定為下拉清單中的選定值

透過使用此方法，即使在提交表單並重新載入頁面後，所選選項仍將保留。

以上是提交後如何在 HTML 表單中保留下拉選擇值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！