使用jQuery未设置选择下拉列表的默认值

Question

我在设置默认值的同时使用jQuery动态添加html选项的选项，但默认值未显示。

这是最初的裸html代码。

<div class="form-group">
        <select id="f_id" class="form-control">
        </select> 
</div>

和我在动态添加选项的jQuery代码

var $fTypeSelect = $('#f_id');
$.each(fVal, function(idx, obj){ 
        $fTypeSelect
        .append($("<option></option>").attr("value",obj["ftype_id"]).text(obj["fType"]));
});

到目前为止，它已添加了下拉选项并且可以正常工作。

我尝试以下列方式设置默认值，但没有一个显示为已选中。

$fTypeSelect.val(fTypeDefaultVal);//Not shown as the default value
$fTypeSelect.val(fTypeDefaultVal).change();// Not shown as default value
$fTypeSelect.trigger("chosen:updated");//Default value is still not shown

我在UI中的下拉如下所示。

展开下拉列表时，会找到所有选项。如何设置默认值？我的jQuery版本是2.1.4。

Answer 1

代码中的某处我设置了不存在的选择下拉列表的值，因此出现问题。

示例：

<select id="f_id" class="form-control">
  <option value="1">example1</option>
</select> 

jQuery代码段

var $fTypeSelect = $('#f_id');
$fTypeSelect.val("1");// This is working
// After few lines of messy code I was setting the wrong value as in below
$fTypeSelect.val("string");// This is where I was wrong

因此没有显示选项。