select下拉框多选可编辑

需要引入magicsuggest插件
magicSuggest直通车

<link rel="stylesheet" href="/lib/magicsuggest/magicsuggest.css">
<script src="/lib/magicsuggest/magicsuggest.js"></script>

/*创建一个magicSuggest 下拉框*/
 <div class="form-group">
      <label class="col-md-3 col-sm-3 control-label">货物尺寸</label>
     <div id="gsize_select"class="col-sm-7"></div>
 </div>

<input type="hidden" id="gsize" name="gsize" value="">

//初始化magicSuggest 下拉框
var gsize_select = $('#gsize_select').magicSuggest({
        placeholder:'请选择',
        data:['8*5*6','8*7*5','8*3*2'],//填充下拉选项内容
        width:"400px",
    });
    
    //获取选中magicSuggest 的值并赋给gsize文本框
    $(gsize_select).on('selectionchange', function(){
        jsonstr = this.getSelection()
        if (jsonstr !=null){
            var nametext ="";
            for (i in jsonstr){
                var name = jsonstr[i].name;
                if (i==0){
                    nametext=name;
                }else{
                    nametext = nametext +";" +name; // 拼接成字符串
                }
            }
        }
        $("#gsize").val(nametext);
    });

//给magicSuggest填充默认选中值
	gsizestr =“6*5*3;2*3*4;6*8*5”;  //后台传过来的值
      objStr =gsizestr.split(";");  // 分割字符串
    	for (i=0;i<objStr.length ;i++ )
   		 {
          gsize_select.setValue([objStr[i]]);
        }

#magicSuggest# 实例参考链接