formSelects-v4.js Layui 在ie浏览器中实现动态多选下拉框
目的为实现如下图所示的效果:
下面代码可以实现:
if (res.length > 0) {
var arr= new Array();
for (var i = 0; i < res.length; i++) {
var item = res[i];
arr.push({name: item.orgName, value: item.orgId});
}
layui.formSelects.data('select2', 'local', {
arr:arr
});
var res=new Array();//渲染已选中的
var area = "";
var tmp = data.data.visibleAreas;
for(var i=0;i<JSON.parse(tmp).length;i++){
area =JSON.parse(tmp)[i].value;
res.push(area)
}
layui.formSelects.value('select2', res, true);
}
但是你可能会发现,这样写了之后并没有显示出该效果.
下面说一下我遇到的坑.
该功能需要引用
layui.css
formSelects-v4.css
layui.js
formSelects-v4.js .
第一个坑就是这四个文件的版本是都兼容,是都一致,尤其是 formSelects-v4.js 和formSelects-v4.css的版本.
第二个坑就是这四个文件在页面的引用顺序不对的也会出错.我的引用顺序依次为layui.css formSelects-v4.css layui.js formSelects-v4.js .
存在上面的问题可能在谷歌等浏览器可以正常显示,但是IE浏览器会出现问题.
版权声明:本文为m0_37585097原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。