layui select下拉框（弹窗中的）

1.html代码

<div id="assignRoles" style="display: none">
<!--style="display: none" 弹窗部分的div是隐藏状态了，只有触发了弹窗才在弹窗框中展示-->
    <div class="layui-form layuimini-form">
        <div class="layui-form-item">
            <label class="layui-form-label required">登录名</label>
            <div class="layui-input-block">
                <input type="hidden" id="id" name="id">
                <input type="hidden" id="userId" name="userId">
                <input type="text" id="loginName1" value="" class="layui-input" disabled>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">用户昵称</label>
            <div class="layui-input-block">
                <input type="text" id="userName1"  value="" class="layui-input" disabled>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">用户角色</label>
            <div class="layui-input-block">
                <select  name="roleId" id="roleId" lay-filter="roleId"  lay-verify="required" >
                    <option value=""></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
            </div>
        </div>
    </div>
</div>

2.js

//渲染select 下拉框选项赋值
  // $("#roleId").empty(); 清空option 选项
 $.ajax({
                url: '/role/selectOptionsRole',
                type: 'GET', //GET
                async: false, //或false,是否异步
                dataType: 'json', //返回的数据格式：json/xml/html/script/jsonp/text
                success: function (data) {
                    $.each(data.result,function(index,item){
                        console.log(item);
                        $("#roleId").append("<option value = '"+item.value+"'>"+item.title+"</option>");                                      
                    layui.form.render("select");                }
            })
          
//打开弹出窗口
 function userRole(data){
            $("#userId").val(data.userId);//将从主页带过来的参数付给页面input框
            $("#loginName1").val(data.loginName);
            $("#userName1").val(data.userName);           
            setSelectRole(data.userId);//加载默认选中值
            var index = layer.open({
                title: '分配角色',
                type: 1,
                closeBtn:1,
                shade: 0.2,
                maxmin:true,
                shadeClose: true,
                area:['45%','55%'],
                content: $("#assignRoles"),
                success:function(layero,index){
                }
            });
        }
//保存弹窗中数据
 form.on('submit(saveBtn)',function(obj){
            $.ajax({
                url: '/user/addRoleUser',
                type: 'POST', //GET
                async: false, //或false,是否异步
                contentType:'application/json',
                data: JSON.stringify(obj.field),
                dataType: 'json', //返回的数据格式：json/xml/html/script/jsonp/text
                success: function (data) {
                    console.log("1111",data);
                    if (data['code'] == 200) {
                        layer.close(layer.index);//保存成功后关闭当前弹窗（最外层）
                        layer.msg(data.msg);//保存成功信息提示
                       //
                    } else {
                        layer.alert('新增失败,请重试或联系管理员处理！' + data['msg']);
                        window.location.reload();
                    }
                },
                error: function (data) {
                    console.log("2222",data);
                    layer.alert('系统登录超时或遇到意外错误，请重新登录，或联系系统管理员!');
                },
            })
        });
 		var j ;//select 选中的index
        //选中值后触发事件 将j改变为当前选中值，以便于打开下一个弹窗时，将选中状态取消
        form.on('select(roleId)',function(data){
            console.log(data.value);
            j=data.value;
        });
        function setSelectRole(userId){
           if(j!=null && j!=''&& j!=undefined){
           //取消选中值（否则关闭弹窗A打开弹窗B的时候，会保留上个弹窗的值）
               document.getElementById("roleId").options[j].selected=false;
           }
           // layui.form.render("select");
            $.ajax({
                url: '/user/queryRoleUser',
                type: 'GET', //GET
                async: false, //或false,是否异步
                data:{
                    userId:userId,
                },
                dataType: 'json', //返回的数据格式：json/xml/html/script/jsonp/text
                success: function (data) {
                        var roleUser = data.roleUser;
                        console.log(roleUser);
                        $('#id').val('');
                        if(roleUser !=null && roleUser !='' && roleUser !=undefined) {
                           // roleUserId = roleUser.id;
                            $('#id').val(roleUser.id);
                            var select = document.getElementById("roleId");
                            for (var i = 0; i < select.options.length; i++) {
                                console.log(roleUser.roleId);
                                console.log(select.options[i].value);
                                if (select.options[i].value == roleUser.roleId) {
                                    //=== 先判断类型是否相等，类型不等返回false 类型相同，继续判断；
                                    // == 不同类型的会进行类型转换，然后进行判断
                                    select.options[i].selected = true;
                                    j=i;
                                    break;
                                }
                            }
                        }
                }
            });
            layui.form.render("select");
        }