下拉框动态显示options遇到的问题

百度后发现，目前资源比较多的就是layui和bootstrap这两种框架了，我是用的bootstrap-select，不知道为啥使用layui的formselect，引入css和js文件后，在select标签中输入xm-select，网页直接select框都不见了，倒腾了半天，选择了bootstrap-select,也挺好用的。

但是碰到了两个问题：

Q1:下拉框会多出一些重复选项

Q2：控制台下的select标签中都填充了options标签，但是网页下拉框中无选项

A1【直接将这段代码复制到你的代码中（代码来自csdn：id:BeClassFive）】:【

　　

$("select").each(function(i,n){ //去重
    var options = "";
    $(n).find("option").each(function(j,m){
        if(options.indexOf($(m)[0].outerHTML) == -1)
        {
            options += $(m)[0].outerHTML;
        }
    });
    $(n).html(options);
});

】

A2:网上查阅得知【https://www.cnblogs.com/staticking/p/10504584.html】，bootstrap-select在对select标签进行初始化的时候，会生成ul标签，而select下拉框的选项会被当作li标签插入到ul中，当你的选项都被插入到ul中时，网页的下拉框才会显示出选项，而我做的代码中select的options是从数据库带出来的，需要经过上述步骤，【注意，直接在select标签中添加的options是会直接在网页显示的】，动态添加options就会出现我这样的问题。

解决方案：动态追加options重新对select框进行渲染：代码如下：【

 　　　　　　　　//使用refresh方法更新UI以匹配新状态。

        $('#selector').selectpicker('refresh');

        //render方法强制重新渲染引导程序 - 选择ui。

        $('#selector').selectpicker('render');

】