layer.open 弹出层中打开的表单页面如何禁用部分输入框
layer.open({ type: 2,//Layer提供了5种层类型。可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层) title: '养护决策-编辑', maxmin: true, //开启最大化最小化按钮 area: ['800px', '624px'],//编辑框尺寸 fixed: false, //不固定 content: 'edit?decisionId=' + data.decisionId, success:function (layero,index){ let disfield=['a0110','a0103','a0203','mileage','maintainArea','budget'] //数组中的字符串是layui的name值 也就是要禁用的输入框和select多选框 disabledInput(disfield,index)
}, });
1 function disabledInput(fieldName,index){// (['',''],index) 2 //用于禁用layer.open打开的页面中的input 寄托于弹出层成功函数success index是打开页面的弹出层索引 disfiled是要禁用的Input以及select-tree的name名字 必须是个数组 3 let body=layer.getChildFrame('body',index); //获取到layer.oepn打开的子页面结构 4 for(let i=0;i<fieldName.length;i++){ //利用find查找 找到数组中我们需要禁用的元素 5 if(body.find("input[name="+fieldName[i]+"]").hasClass('xm-select-default')){//判断是输入框还是select选择框 如果是slect选择框 那么我们需要把它替换为input输入框 因为select选择框 无法禁用 6 body.find("div[id="+fieldName[i]+"]").replaceWith('<input type="text" name='+fieldName[i]+' readonly class="input-readonly layui-input">'); 7 }else{ 8 body.find("[name="+fieldName[i]+"]").addClass('input-readonly').attr('readonly',true);//设置禁用属性 这里用readonly或者disabled都可以 添加类名 input-readonly 设置样式 border:none,backgorund:#efefef 9 } 10 } 11 }
本文来自博客园,作者:火知火味,转载请注明原文链接:https://www.cnblogs.com/whwa/p/15271884.html