1. 程式人生 > >bootstrap-select外掛多選,選擇第一個option排在第一位,選擇第三個option排在第二位,選擇第二個option排在第三位

bootstrap-select外掛多選,選擇第一個option排在第一位,選擇第三個option排在第二位,選擇第二個option排在第三位

最近專案有個奇葩的需求,要求下拉框多選,選擇option的順序要和點選選擇option的順序一致,這就麻煩了,所以只修改原始碼了,所以

找到bootstrap-select.js這段程式碼,

if (!title) {
   title = this.options.title !== undefined ? this.options.title : this.options.noneSelectedText;
}

然後在下面把我們自己的程式碼寫進去

if(title != '請選擇'){
    title = title.replace(" ","");
    var tmpTitle = this.$newElement.find('.filter-option').html();
    if(tmpTitle == '請選擇'){
        tmpTitle = "";
    }
    var isAdd = tmpTitle.length > title.length ? false:true;
    if(isAdd){
        var tmpTitleArray = tmpTitle.split(",");
        var titleArray = title.split(",");
        for(var i=0;i<titleArray.length; i++){
	    var value = titleArray[i];
	    value = value.trim();
	    var a = isInArray(tmpTitleArray,value);
	    if(!a){
	        tmpTitle = tmpTitle.trim();
		tmpTitle+= tmpTitle==""?value:","+ value
		break;
	    }
        }
    }else{
	title = title.replace(" ","");
	var tmpTitleArray = tmpTitle.split(",");
	var titleArray = title.split(",");
	for(var i=0;i<tmpTitleArray.length; i++){
	    var value = tmpTitleArray[i];
	    var a = isInArray(titleArray,value);
	    if(!a){
		tmpTitle = tmpTitle.trim();
		if(tmpTitleArray[0] == value && tmpTitleArray.length>1){
		    tmpTitle = tmpTitle.replace(value+",","");
		}else if(tmpTitleArray.length>1){
		    tmpTitle = tmpTitle.replace(","+value,"");
		}else{
		    tmpTitle = tmpTitle.replace(value,"請選擇");
		}
		break;
	    }
	}
    }
    title = tmpTitle;
}

在要在bootstrap-select.js中加入這個函式

 function isInArray(arr,value){
    for(var i = 0; i < arr.length; i++){
        if(value === arr[i]){
            return true;
        }
    }
    return false;
}