如何预先选择<选择>列表项

How to preselect a <select> list item in using JavaScript

本文关键字：选择 列表 gt lt 何预先      更新时间：2023-09-26

我有这个标记和javascript。我无法获得"T"选项（例如）在页面加载时进行预选。有可能吗？

    <select id="serviceType" name="serviceType" class="form-control">
      <option value="S">S</option>
      <option value="T">T</option>
      <option value="X">X</option>
    </select>
    <script>
        //document.getElementById("serviceType").selectedIndex = "T"; // did not work
      var e = document.getElementById("serviceType");
      e.options[e.selectedIndex].value = "T"; // does not work
    </script>

注意："T"在PHP中的DB调用的页面构建时是动态的。所以我的剧本实际上是这样的：= "<? echo $_POST['serviceType']; ?>"

您的注释行不起作用，因为select元素的selectedIndex属性需要所选元素的顺序索引。

document.getElementById("serviceType").selectedIndex = 1;
<select id="serviceType" name="serviceType" class="form-control">
  <option value="S">S</option>
  <option value="T">T</option>
  <option value="X">X</option>
</select>

如果您想通过值进行设置，那么您也可以设置元素的value属性

document.getElementById("serviceType").value= "T";
<select id="serviceType" name="serviceType" class="form-control">
  <option value="S">S</option>
  <option value="T">T</option>
  <option value="X">X</option>
</select>

就这样做吧：

var e = document.getElementById("serviceType");
e.value="T";

这是正在工作的小提琴。

您必须设置select标记的value，而不是option:

var e = document.getElementById("serviceType");
e.value = "T";

最简单的方法是在html5 中使用select

<select id="serviceType" name="serviceType" class="form-control">
  <option value="S">S</option>
  <option value="T" selected>T</option>
  <option value="X">X</option>
</select>
相关文章：