如何在jQuery selectmenu中预选选项

Question

我有一个动态填充的jquery ui selectmenu，因此我没有选项在其中一个选项中设置"选择"属性。

for (var i = 0; i < Data.length; i++) 
{
$("#ListID").append($("<option></option>").val(Data[i].ColorName).html(Data[i].ColorName));
}

另外，我尝试了各种其他方法来设置选定的值，例如：

1. $('#ListID').val(Data[0].ColorName);不起作用

2. $("#ListID[value='" + Data[0].ColorName + "']").attr('selected', 'selected');不起作用

3. $('#ListID').selectmenu("refresh");＆lt; =这显示了最后一个值，但仍未选择它，因为提交显示空白值

因此，我应该如何将selectmenu中的选项预选为第一个元素的第一个元素

问题在于它总是迫使用户从下拉列表中选择一个选项，否则它在提交时显示空白值，因为我正在预选一个值，因此不应该这样。

Answer 1

尝试以下：

for (var i = 0; i < Data.length; i++) 
{
   $("#ListID").append("<option value='"+Data[i].ColorName+"' "+(i == 0 ? "selected":"")+">"+Data[i].ColorName+"</option>");
}

或

for (var i = 0; i < Data.length; i++) 
{
    $("#ListID").append($("<option "+(i == 0 ? "selected":"")+"></option>").val(Data[i].ColorName).html(Data[i].ColorName));
}

使用选择的选项您要选择的选项。

Answer 2

只是我通过制作一系列颜色做出了一个简单的选择，请从这里获取您的想法，让我知道它是否有效。

 $("#ListID").selectmenu();
var Data = [{ColorName:"orange"},{ColorName:"blue"},{ColorName:"green"},{ColorName:"red"}];
var selected = "blue";
for (var i = 0; i < Data.length; i++) 
{
var select = '';
if(selected==Data[i].ColorName){
   select = "selected=selected";
}
$("#ListID").append($("<option "+select+"></option>").val(Data[i].ColorName).html(Data[i].ColorName));
}
$("#ListID").selectmenu("refresh");

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  
<select id="ListID">
</select>

Answer 3

让我们尝试此选择。

<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

我们想动态地在jQuery中选择梅赛德斯。

$("#cars option[value='mercedes']").prop('selected', true);

选项[value ='']是选择器。

jsfiddle：https://jsfiddle.net/onurgule/t4obc56s/

jQuery UI小提琴：https：//jsfiddle.net/onurgule/p44mta9e/