Question

我正在尝试使用此行选择这些选项中的一个

document.getElementById("combobox-month").selectedIndex = 5;

但是它为什么行不通？

document.getElementById("combobox-month").selectedIndex = 5;

<div id="content-birthday">
  <div id="combobox-month" class="combobox-wrapper">
    <select name="bday_month">
      <option value="1">January</option>
      <option value="2">February</option>
      <option value="3">March</option>
      <option value="4">April</option>
      <option value="5">May</option>
      <option value="6">June</option>
      <option value="7">July</option>
      <option value="8">August</option>
      <option value="9">September</option>
      <option value="10">October</option>
      <option value="11">November</option>
      <option value="12">December</option>
    </select>
  </div>
</div>

Answer 1

combobox-month是 select 元素的父div的 id 。您应该定位 select 元素。您可以使用querySelector()，它允许类似CSS的选择器。

尝试

document.querySelector("select[name=bday_month]").selectedIndex = 5;

<div id="content-birthday">
  <div id="combobox-month" class="combobox-wrapper">
    <select name="bday_month">
      <option value="1">January</option>
      <option value="2">February</option>
      <option value="3">March</option>
      <option value="4">April</option>
      <option value="5">May</option>
      <option value="6">June</option>
      <option value="7">July</option>
      <option value="8">August</option>
      <option value="9">September</option>
      <option value="10">October</option>
      <option value="11">November</option>
      <option value="12">December</option>
    </select>
  </div>
</div>

Answer 2

目标元素是错误的。您以选择对象的父对象为目标，因此向选择标签元素添加了一些ID。然后通过dom调用

document.getElementById("select").selectedIndex = 5;

<div id="content-birthday">
  <div id="combobox-month" class="combobox-wrapper">
    <select name="bday_month" id="select">
      <option value="1">January</option>
      <option value="2">February</option>
      <option value="3">March</option>
      <option value="4">April</option>
      <option value="5">May</option>
      <option value="6">June</option>
      <option value="7">July</option>
      <option value="8">August</option>
      <option value="9">September</option>
      <option value="10">October</option>
      <option value="11">November</option>
      <option value="12">December</option>
    </select>

Answer 3

我认为您使用了错误的选择器。

document.querySelector("select").selectedIndex = 5;

如果要使用班级，请添加以选择“ select-month”之类的班级。

document.querySelector(".select-month").selectedIndex = 5;

.非常重要。它指示以下字符串是一个类。 #代表ID

Answer 4

您将获得div元素，而不是组合框。

在组合框上放置一个ID，并在您的getElementById中使用它。

Answer 5

请在下拉列表中指定ID。combobox-month是div的ID

document.getElementById("bday_month").selectedIndex = 5;

添加了bday_month作为ID。

 <select id="bday_month" name="bday_month">
  <option value="1">January</option>
  <option value="2">February</option>
  <option value="3">March</option>
  <option value="4">April</option>
  <option value="5">May</option>
  <option value="6">June</option>
  <option value="7">July</option>
  <option value="8">August</option>
  <option value="9">September</option>
  <option value="10">October</option>
  <option value="11">November</option>
  <option value="12">December</option>
</select>

尝试从javascript中的组合框中选择，但通常方式不起作用

5 个答案: