极乐门资源网 Design By www.ioogu.com

如下所示:

var html = '<form class="layui-form" action="">'
			+ '<div class="layui-form-item"><label class="layui-form-label">角色名</label><div class="layui-input-block"><input type="text" name="rolename" required lay-verify="required" placeholder="请输入角色名" autocomplete="off" class="layui-input"></div></div>'
			+ '<div class="layui-form-item layui-form-text"><label class="layui-form-label">角色描述</label><div class="layui-input-block"><textarea name="roledesc" placeholder="请输入角色描述" class="layui-textarea"></textarea></div></div>'
			+ '<div class="layui-form-item"><label class="layui-form-label">是否启用</label><div class="layui-input-block"><input type="checkbox" name="switch" lay-skin="switch" lay-text="开启|关闭"></div></div>'
			+ '<div class="layui-form-item" hidden><div class="layui-input-block"><button id="addRole" class="layui-btn" lay-submit lay-filter="formDemo">提交</button></div></div>'
			+ '</form>';
 
	layer.open({
		type : 0,
		title : '添加角色',
		area : [ '500px', '400px' ],
		shadeClose : true, // 点击遮罩关闭
		content : html,
		btn : [ '确认', '取消' ],
		success : function(index, layero) { // 成功弹出后回调
			form.render('checkbox'); // 刷新checkbox开关渲染(否则开关按钮会不显示)
		},
		yes : function(index, layero) { // 确认按钮回调函数
			layero.find('#addRole').click();
		},
		btn2 : function(index, layero) { // 取消按钮回调函数
			layer.close(index); // 关闭弹出层
		}
	});

我的弹出层表单验证不起作用的原因是将弹框参数type设置成0了,将type改为1之后表单就起作用了

layer.open({
		type : 1,
		title : '添加角色',
		area : [ '500px', '400px' ],
		shadeClose : true, // 点击遮罩关闭
		content : html,
		btn : [ '确认', '取消' ],
		success : function(index, layero) { // 成功弹出后回调
			form.render('checkbox'); // 刷新checkbox开关渲染(否则开关按钮会不显示)
		},
		yes : function(index, layero) { // 确认按钮回调函数
			layero.find('#addRole').click();
		},
		btn2 : function(index, layero) { // 取消按钮回调函数
			layer.close(index); // 关闭弹出层
		}
	});

以上这篇解决layer弹出层中表单不起作用的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

标签:
layer,弹出层,表单

极乐门资源网 Design By www.ioogu.com
极乐门资源网 免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
极乐门资源网 Design By www.ioogu.com

评论“解决layer弹出层中表单不起作用的问题”

暂无解决layer弹出层中表单不起作用的问题的评论...