从下拉列表中删除所选选项，然后添加新的选定值不会使用jquery突出显示该选项

Question

我试图根据使用AJAX获取的数据选择选项值。

这是第一次使用，但在删除选项然后重新添加后无法运行。

$("#branch option:selected").removeAttr('selected');
   $.each(joblocation_array, function(i,val) {
   $('#branch option[value="'+val+'"]' ).attr("selected", true);
});

Answer 1

使用jQuery更改所选选项的正确方法是使用.val()函数。

来自jQuery documentation：

  

val()允许您传递元素值数组。这很有用   处理包含<input type="checkbox">，<input type="radio">和<option>等元素的jQuery对象时   <select>。在这种情况下，输入和选项具有值   匹配数组中的一个元素将被选中或选中   而那些具有与其中一个元素不匹配的值的人   数组将取消选中或取消选中，具体取决于类型。在   <input type="radio"> s的情况属于无线电组和   <select> s，将取消选择任何先前选定的元素。

所以，选择一个选项：

$("#myselect").val(*value*);

要选择多个选项（使用多个选择），您必须传递一组值：

$("#myselect").val([val1,val2]);

请参阅以下示例：

＆＃13;

＆＃13;

$("#btnAction").click(function(){
  $("#test").val(["2","4"]);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="test" multiple="multiple">
  <option id="opt1" value="1" selected="selected">One</option>
  <option id="opt2" value="2">Two</option>
  <option id="opt3" value="3">Three</option>
  <option id="opt4" value="4">Four</option>
  <option id="opt5" value="5">Five</option>
</select>
<button id="btnAction">Select 2 and 4</button>

＆＃13;

＆＃13;

＆＃13;

我希望它可以帮助你，再见。

Answer 2

假设你有：

<select id="mySelect" multiple>
    <option value="aaa">aaa</option>
    <option value="bbb">bbb</option>
    <option value="ccc">ccc</option>
    <option value="ddd">ddd</option>
    <option value="eee">eee</option>
</select>

设置多个选项：

var values = ['aaa', 'ccc'];
$("#mySelect").val(values);

向当前选择的选项添加选项：

var values = ['ddd', 'eee'];
var currentSelection = $("#mySelect").val();
$("#mySelect").val(currentSelection.concat(values));

取消选择一个选项：

var value = 'eee';
var currentSelection = $("#mySelect").val();
var index = currentSelection.indexOf(val)
if(index > -1) {
    currentSelection.splice(index, 1);
}
$("#mySelect").val(currentSelection);

取消选择多个选项：

var values = ['aaa', 'eee'];
var currentSelection = $("#mySelect").val();
for(var i=0; i<values.length; i++) {
    var index = currentSelection.indexOf(values[i])
    if(index > -1) {
        currentSelection.splice(index, 1);
    }
}
$("#mySelect").val(currentSelection);

<强> DEMO1

<强> DEMO2