弹出层提交表单的js

layer.open({	type : 2,	title : '添加权限',	area : [ '500px', '450px' ],	offset : '160px',	shadeClose : true, // 点击遮罩关闭	btn : ['保存','取消'],	content : 'permission_add.html',	success : function(layero, index) { // 成功弹出后回调			},	yes : function(index, layero) { // 保存按钮回调函数	    // 获取iframe层的body	    var body = layer.getChildFrame('body', index);	    // 找到隐藏的提交按钮模拟点击提交	    body.find('#permissionSubmit').click();	},	btn2 : function(index, layero) { // 取消按钮回调函数		layer.close(index); // 关闭弹出层	}});	

弹出层表单中隐藏的提交按钮代码

<div class="layui-form-item" hidden>    <div class="layui-input-block">        <button id="permissionSubmit" class="layui-btn" lay-submit lay-filter="*">        保存        </button>    </div></div>

iframe页面js内容

<script>  // 初始化表单  layui.use([  'form',  'layer'  ], function() {    var  form = layui.form, layer = layui.layer,  $ =  layui.$;    // 更新页面渲染，否则会造成页面加载元素不完整     form.render();    // 自定义表单验证    form.verify({      name : function(value, item) { // 验证功能名        var  defaultName  = $('#defaultName').val(); // 默认的name        if (value !== defaultName || 'default' === defaultName)  { // 判断功能名字是否发生改变          if (!new RegExp("^[a-zA-Z0-9|\u4e00-\u9fa5\]{2,10}$")              .test(value)) {            return '权限名必须是2-10位中英文或者数字的字符';          } else {            code = 0; // 用来判断功能名是否存在            $.ajax({              type : 'POST',              url  : 'queryNameIsExist.do',              data : {                name : value              },              async :  false,              dataType : 'json',              success  : function(data) {                if (!data.success) { //  功能名已经存在                  code = 1;                }              },              error :  function(data) {                code = 2;              }            });            // 根据code判断角色名是否存在            if (code ==  1) {              return '功能名已经存在,请更换';            } else if (code  == 2) {              return '出现异常,请联系管理员';            }          }        }      },      url  : function(value, item)  { // 校验功能url        var  defaultUrl = $('#defaultUrl').val(); //  默认的url        if (value !== defaultUrl ||  'default' === defaultUrl) {  // 判断功能url是否发生改变          if (!new RegExp("^[a-zA-Z0-9/]{5,30}$").test(value)) {            return 'url必须是5-30位英文和/组成的字符串';          } else {            code = 0; // 用来判断功能url是否存在            $.ajax({              type : 'POST',              url  : 'queryUrlIsExist.do',              data : {                name : value              },              async :  false,              dataType : 'json',              success  : function(data) {                if (!data.success) { //  功能url已经存在                  code = 1;                }              },              error :  function(data) {                code = 2;              }            });            // 根据code判断功能url是否存在            if (code ==  1) {              return '功能url已经存在';            } else if (code  == 2) {              return '出现异常,请联系管理员';            }          }        }      },      permission : function(value, item) { //  校验权限字符串        var  defaultPermission =  $('#defaultPermission').val(); // 默认的权限字符串        if (value !== defaultPermission            || 'default' !== defaultPermission)  { // 判断功能权限字符串是否发生改变          if (!new RegExp("^[a-zA-Z0-9]{2,20}$").test(value))  {            return '权限字符串必须是2-20位英文字符';          } else {            code = 0; // 用来判断功能权限字符串是否存在            $.ajax({              type : 'POST',              url  : 'queryPermissionIsExist.do',              data : {                name : value              },              async :  false,              dataType : 'json',              success  : function(data) {                if (!data.success) { //  功能权限字符串已经存在                  code = 1;                }              },              error :  function(data) {                code = 2;              }            });            // 根据code判断功能权限字符串是否存在            if (code ==  1) {              return '功能权限字符串已经存在';            } else if (code  == 2) {              return '出现异常,请联系管理员';            }          }        }      }    });     // 监听form表单提交    form.on('submit(save)',  function(data) {      $.ajax({        type : 'POST',        url  : 'createResource.do',        data : {          name : $('#name').val(),          url  : $('#url').val(),          type : $('input[name]:checked').val(),          parentId : $('#parentId').val(),          permission : $('#permission').val(),          available :  $('#available').is(':checked') === true  ? 1  : 0        },        dataType : 'json',        success  : function(data) {          // 成功提示框          parent.layer.msg('添加成功', {            icon : 6,          });          parent.layer.closeAll('iframe'); //关闭弹框        },        error :  function(data) {          // 异常提示          parent.layer.msg('出现网络故障', {            icon : 5          });          parent.layer.closeAll('iframe'); //关闭弹框        }      });      return false;    });  });</script>

我们只需要在保存按钮的回调函数中获取到iframe页面的隐藏的提交按钮然后使用click()事件就可以提交弹出iframe层的表单了，表单验证和表单提交都在iframe页面的js中，iframe页面的js中需要注意的是弹窗操作需要操作父页面的layer来进行