設置的選定屬性 <select multiple>用jQuery

Question

我有多種選擇，例如：

 <select multiple id="brand">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select> 

我正在尋找一種最終的方式：

 <select multiple id="brand">
  <option value="volvo" selected="selected">Volvo</option>
  <option value="saab" selected="selected">Saab</option>
  <option value="opel" selected="selected">Opel</option>
  <option value="audi" selected="selected">Audi</option>
</select>

我不能依賴外部庫，也不能使.each函數正常工作。 此外，我得到了具有許多字段的原始設置，並且僅在特定情況下才將其設置為該設置，但是我不知道為什么這對我不起作用。 我發現最接近的方法是：

$("#brand").each(function(){$(this).attr("selected","selected");});

您能指出我出問題的地方嗎？ 謝謝

Answer 1

您需要選擇選項，例如使用#brand > option選擇器：

 $("#brand > option").each(function() { $(this).attr("selected","selected"); }); console.log($("#brand").html()); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select multiple id="brand"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="opel">Opel</option> <option value="audi">Audi</option> </select> 

Answer 2

在Vanilla Script中，您可以使用類似這樣的內容

  document.querySelectorAll('#brand option').forEach((o)=>{
    o.selected = 'selected'
  })

如果需要IE，請注意，節點列表不支持For Each。 這應該工作。 IE

nodesArray = [].slice.call(document.querySelectorAll("#brand option"));
nodesArray.forEach(function (o) {
     o.selected = 'selected'
})

您不會看到HTML代碼中的更改，但是選項的DOM屬性將更改。 希望這可以幫助。