Jquery 设置 optgroup 选定值

Question

我不确定如何设置 optgroup 选择值，确保所选选项具有正确的标签。我遇到的问题是我有两个标签，但每个标签的选项可以是相同的。

标签 1 = 本田标签 2 = 丰田

两者的选项:

选项 1 =“红色”选项 2 =“蓝色”...

我想在 document.ready() 上将本田标签下的所选选项设置为蓝色。目前，当我尝试将选项设置为选定的选项时，使用“蓝色”的最后一个项目是在本例中选择的项目，即丰田标签下的蓝色。

我已经尝试过:

var color ="Blue";
var make ="Honda";
var test = $('#car_selector optgroup[label='+make+'] option[value="'+color+'"]')
test.prop('selected', true);

<select>
 <optgroup label="Honda">
   <option value="blue">Blue</option>
   <option value="red">Red</option>
 </optgroup>
 <optgroup label="Toyota">
   <option value="blue">Blue</option>
   <option value="red">Red</option>
 </optgroup>
</select>

Answer 1

假设您有与此类似的标记:

<select>
  <optgroup label="Honda">
    <option value="blue">Blue</option>
    <option value="red">Red</option>
  </optgroup>
</select>

这个 JS 可以工作:

var make = 'Honda';
var color = 'red';

var optgroup = $('select optgroup[label="'+make+'"]')
var option = optgroup.find('option[value="'+color+'"]')

option.attr('selected', true)

JSBin here

编辑正如我在评论中提到的，这只是将 make 变量正确引用到选择器中的错误。