layui.layer.open 传值

在 Layui 框架中，`layer.open` 方法用于创建弹出层，可以通过多种方式传递参数。以下是几种常见的参数传递方法： ### 1. 使用 `data` 参数传递数据 可以在 `layer.open` 的配置中直接使用 `data` 属性来传递数据，子页面可以直接通过 `parent` 对象访问这些数据[^2]。 ```javascript function layer_show(title, url, data, w, h) { if (title == null || title == '') { title = false; } if (url == null || url == '') { url = "404.html"; } if (w == null || w == '') { w = 800; } if (h == null || h == '') { h = ($(window).height() - 50); } layer.open({ type: 2, area: [w + 'px', h + 'px'], fix: false, // 不固定 maxmin: true, shade: 0.4, title: title, data: data }); } ``` 子页面中可以这样获取传递的数据： ```javascript var data = parent.data; ``` ### 2. 通过 URL 查询字符串传递参数 另一种常见的方式是将参数附加到 URL 上作为查询字符串，然后在子页面中解析这些参数。 ```javascript layer.open({ type: 2, area: ['800px', '600px'], content: url + '?data=' + encodeURIComponent(JSON.stringify(data)) }); ``` 子页面中可以使用如下代码来解析 URL 中的参数： ```javascript function getParameterByName(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"), results = regex.exec(location.search); return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } var data = JSON.parse(getParameterByName('data')); ``` ### 3. 子窗口向父窗口传值 如果需要从子窗口向父窗口传递数据，可以通过操作父窗口的 DOM 元素或者调用父窗口的方法来实现[^4]。 子窗口中设置父窗口的输入框值： ```javascript function btnBack() { $("#cz", window.parent.document).val('2'); // 传给父窗口 var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); // 关闭子窗口 } ``` 父窗口中可以在 `end` 回调中处理接收到的数据： ```javascript end: function () { var cz = $("#cz").val(); if (cz == '2') { document.getElementById('cz').value = '1'; return false; } } ``` ### 4. 使用回调函数传递结果 当关闭弹出层时，可以通过回调函数传递结果回父窗口[^3]。 ```javascript layer.open({ type: 0, skin: "layui-layer-molv", title: "信息", content: data.code == 1 ? "添加成功！" : "添加失败!", btn: ['返回列表'], yes: function () { let index = parent.layer.getFrameIndex(window.name); parent.layui.table.reload('news_table'); // 重载父页表格，参数为表格ID parent.layer.close(index); } }); ```