引入文件:
<link href="~/Scripts/combo-select/combo.select.css" rel="stylesheet" />
<script src="~/Scripts/combo-select/jquery.combo.select.js"></script>
HTML:
<li class="mt-30">
<span class="label">指标名称(中文):</span>
<select name="pollutantcn" id="pollutantcn">
<option value=""></option>
</select>
</li>
JS:
参数说明:
domId:标签Id,参照HTML
req:异步方法请求地址
data:请求参数
function initSelect4(domId, reqUrl, data) {
$.ajax({
url: reqUrl,
type: "POST",
dataType: "json",
data: JSON.stringify(data),
contentType: "application/json",
success: function (result) {
if (result.code == 200) {
var list = result.data;
var html = "";
html += '<option value=""></option>';
$.each(list, function (index, obj) {
var num = index + 1;
html += '<option value="' + obj.name + '">' + obj.name + '</option>';
})
$("#" + domId).html(html);
$("#" + domId).comboSelect();
} else {
console.log("未拉取到数据导致Select框加载失败!")
}
},
error: function (message) {
console.log("服务器异常导致Select框加载失败!")
}
})
}
局部加载重复初始化问题:
使用下面代码替换“$("#" + domId).comboSelect();”
if (!$("#" + domId).parent().hasClass("combo-select")){
$("#" + domId).comboSelect();
}
还有一个问题正在研究,多个select局部加载重复初始化问题......(目前还没有找到好的解决方式,所以用select2替换了)