11

我使用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)

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

谢谢你

4

2 回答 2

18

浏览器将自动选择第一个选项，除非您将多个属性添加到元素。

看看你的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' );
   }
于 2012-09-27T11:18:43.090 回答
1

并且您始终可以通过循环遍历元素并将值设置为未选中来确保它可以正常工作，例如：

  click: function(event, ui){

 if(!ui.checked) 
 {   $.each( $('#select2 option'),function(i2, element2)
       {
                if( $(element2).val() === ui.value )
                {
                   if( $(element2).is(':selected') ) { 
             $(element2).attr('selected',false); 
                }
                     $(element2).remove().appendTo('#select1');
                    }        
        });
 }

}

这只是在您动态更新并希望确保如此的情况下......在我的情况下，我正在更新/将元素从一个下拉列表传递到另一个下拉列表并且两者都具有 multiple='multiple' 属性，所以我需要确保在单击一个被删除时，然后将其附加到底层选择但仍然始终选择第一个选项..希望它可以帮助某人在路上..这是一个不错的插件

于 2012-10-02T01:25:57.843 回答