Question

所以我试图用Javascript做的是，当我做类似于document.getElementByID（“product-select”）的事情的时候这样做.value =“34”; 它会自动按下它。

每当我尝试这样做时它会使下拉菜单变为空白而不会自动更改它。我可以帮忙吗？

<div id="product-variants" class="">
  <div class="select-wrapper">
    <select id="product-select" name="id" class="">




      <option value="28223706565">32</option>



      <option value="28223706629">34</option>



      <option value="28223706693">36</option>


    </select>
  </div>
</div>

Answer 1

下拉值未自动更改的原因是，当您使用 document.getElementByID（＆＃34; product-select＆＃34;）设置下拉值时。值=＆＃34; 34＆＃34; ，它不会选择文本节点为 34 的选项，只有当您的某个选项的值为34时才会更改下拉列表。为了使其工作，您可以如下所示更改您的实施：

var x = document.getElementById("product-select").options;
   for(var i=0;i<x.length;i++){
        if(x[i].text=="34"){
            x[i].selected=true;
            break;
   }
}

Answer 2

也许

document.getElementByID("product-select").value = "34";

应该是

document.getElementByID("product-select").value = "28223706629";

另一种方法是引用索引，例如

document.getElementById("product-select").selectedIndex = 1;

Answer 3

如果您知道值的顺序，可以使用

document.getElementByID("product-select").selectedIndex方法

如果你想在这种情况下选择值34，那么它是第二个选项，因此它的索引是1，32索引是0而36索引是2

因此，如果您想将值更改为34，请调用

document.getElementByID("product-select").selectedIndex = 1

Javascript，自动选择下拉菜单

3 个答案: