1. 父页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>折扣管理</title>
<link rel="icon" type="image/x-icon" href="../images/Strawberry.png"/>
<link rel="stylesheet" type="text/css" href="../../../layui/css/layui.css"/>
<link rel="stylesheet" type="text/css" href="../css/index.css"/>
</head>
<body>
<div class="topContent">
<div class="title">折扣配置</div>
<div id="fatherTest"></div>
<div class="btn">新增折扣</div>
</div>
<div class="content">
<div class="form" id="form">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">城市大类</label>
<select name="city" lay-verify="">
<option value="">请选择一个城市</option>
<option value="010">北京</option>
<option value="021">上海</option>
<option value="0571">杭州</option>
</select>
</div>
<div class="layui-form-item">
<label class="layui-form-label">输入框</label>
<div class="layui-input-block">
<input type="text" name="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
</div>
</div>
</form>
</div>
</div>
<script src="../../../layui/layui.js"></script>
<script src="../../../js/jquery-3.4.1.min.js"></script>
<script type="text/javascript"> layui.use('form', function(){ var form = layui.form; //监听提交
form.on('submit(formDemo)', function(data){ layer.msg(JSON.stringify(data.field)); return false; }); $('.btn').click(function(){ layer.open({ type: 2,//type: 2 为iframe层
title: '我是子页面', shadeClose: true, shade: 0.8, area: ['60%', '50%'], content: 'son.html' , //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
btn: ['确定', '取消'] , yes:function(index,layero){ /*$(layero).find("iframe").eq(0).contents();多个iframe层使用才使用eq , * 需要先找到iframe,才能得到iframe里面的其他元素来进行传值取值 */
//获取子页面元素 -- $("iframe").contents().find("子页面id名")
var father = $(layero).find("iframe").contents(); //找到父页面中的第一个input传给子页面
var form = $('#form').find('input').eq(0).val(); father.find("#sonTest").html('父页面选择的值是---'+ form); }, success:function(){ //调用子页面的方法 -- $('iframe')[0].contentWindow.方法名();
$('iframe')[0].contentWindow.funSon() } }); }) }); function funFather(){ alert('我是父页面的方法，我被调用了') } </script>
</body>
</html>
2.子页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>新增折扣管理</title>
<link rel="icon" type="image/x-icon" href="../images/Strawberry.png"/>
<link rel="stylesheet" type="text/css" href="../../../layui/css/layui.css"/>
<link rel="stylesheet" type="text/css" href="../css/index.css"/>
</head>
<body>
<div class="topContent">
</div>
<div class="content">
<div id="sonTest"></div>
<div class="form" id="sonForm">
<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="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
</div>
</div>
<button id="define">点击传给父页面</button>
</form>
</div>
</div>
<script src="../../../layui/layui.js"></script>
<script src="../../../js/jquery-3.4.1.min.js"></script>
<script type="text/javascript"> layui.use('form', function(){ var form = layui.form; //监听提交
form.on('submit(formDemo)', function(data){ layer.msg(JSON.stringify(data.field)); return false; }); }); $('#define').click(function(){ var sonForm = $('#sonForm').find('input').val();
//获取父页面元素 -- $("父页面id名",window.parent.document)
$("#fatherTest",window.parent.document).html('子页面选择的值是' + sonForm);
//调用父页面的方法 -- parent.方法名();
parent.funFather(); }); function funSon(){ alert('我是子页面的方法，我被调用了') } </script>
</body>
</html>