javascript - 当 Eric Hynds 的带有 JQuery Multiselect UI 的选择框动态更新时自动选择第一个选项

Question

我使用 http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/ 的 JQuery UI 多选插件将元素动态附加到选择框

//Make filter cars multiselect
$("#cars_filter").multiselect({noneSelectedText:'Select cars'});

function populateCarfilter(){
    var opts="<option value=''>Select cars</option>";
    $.each(markers, function(idx, mar){
      if(mar.getVisible() && mar.get("car"))
     opts+="<option value='" + mar.get("id") + "'>" + mar.get("driver") + " - " + mar.get("car") + "</option>";
    });

    if($("#cars_filter").html()!=opts){
      var id = $("#cars_filter").val()
      $("#cars_filter").html(opts);
      $("#cars_filter").val(id);
      $("#cars_filter").multiselect('refresh');
    }    
}

populateCarfilter(); //This gets called every 2 secs automatically by SSE (server sent events)

现在，我面临一个奇怪的问题。每次更新选择框时，都会自动选择选择框中的第一个选项。有什么办法可以解决这个问题吗？

谢谢

Answer 1

除非您向元素添加 multiple 属性，否则浏览器将自动选择第一个选项。

在你的 jQuery MultiSelect UI Widget javascript 源文件中看到，他们已经实现了以下

// browsers automatically select the first option
// by default with single selects
if( isSelected && !o.multiple ){
    labelClasses.push( 'ui-state-active' );
   }