複数選択、構文エラー、認識できない表現：オプション[値= ccのddの]

Question

私はこのようになります複数選択を持っている：

<select name="test" id="test" multiple="multiple"> 
<option value="aa" id="at1">AA</option> 
<option value="bb" id="at1">BB</option> 
<option value="cc dd" id="at1">CC DD</option> 
<option value="ee" id="at1">EE</option></i> 
</select> 

今、私は値を検索し、選択するには、このコードを使用していますオプション：

var at=$("#divat").text();//at="bb,cc dd,ee" 
atMulti = at.split(',');//atMulti=['bb','cc dd','ee'] 
$.each(atMulti,function(n,value){ 
    $('option[value='+value+']',$('#test)).prop('selected',true); 
} 

私は

$("option[value='"+value+"']",$('#test)).prop('selected',true);} 

エラーコードのエラーを取得していますが

を語ります

Syntax error, unrecognized expression: option[value=cc dd] 

私は

$.each(atMulti,function(n,value){ 
    $("option[value='"+value+"']",$('#test)).prop('selected',true); 
} 

に私のコードを変更した場合はそこにはエラーはありませんが、唯一の最初に一致した値

<option value="bb" id="at1">BB</option> 

が選択されます。この問題を解決するには？

Answer 1

idと同じHTMLページで複数の要素を同じにすると、invalidマークアップになります。そこで、以下のようにしてみてください：

var at="aa,bb,cc dd,ee";//values to be select 
 
atMulti = at.split(',');//atMulti=['bb','cc dd','ee'] 
 
$.each(atMulti,function(n,value){ 
 
    $("option[value='"+value+"']").prop('selected',true);//remove $("#test") from here 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="test" id="test" multiple="multiple"> 
 
<option value="aa">AA</option> 
 
<option value="bb" >BB</option> 
 
<option value="cc dd">CC DD</option> 
 
<option value="ee">EE</option> 
 
</select>