layui怎么向iframe传数据

你可以通过以下步骤向 iframe 传递数据：

1. 获取 iframe 元素：

var iframe = document.getElementById('my-iframe');

2. 获取 iframe 的 window 对象：

var iframeWindow = iframe.contentWindow;

3. 向 iframe 的 window 对象发送消息：

iframeWindow.postMessage('hello', '*');

其中，第一个参数是要发送的消息，可以是字符串、数字、对象等。第二个参数是接收消息的窗口的 origin，用 * 表示任意域名。如果你知道接收消息的窗口的域名，最好指定为具体的域名，以增强安全性。

4. 在 iframe 内部监听消息：

window.addEventListener('message', function(event) {
  console.log(event.data); // 输出接收到的消息
});

在 iframe 内部监听 window 对象的 message 事件，当接收到消息时，可以通过 event.data 获取到消息内容。

相关问题

layui iframe传值

在 layui中，可以通过url传递参数来实现iframe与父页面之间的数据传递。

在父页面中，可以使用以下代码来打开iframe并传递参数：

layui.use('layer', function(){
  var layer = layui.layer;
  layer.open({
    type: 2,
    title: 'iframe传值示例',
    shadeClose: true,
    shade: 0.8,
    area: ['800px', '600px'],
    content: 'iframe.html?id=123',
    end: function(){
      // 关闭时触发的回调函数
    }
  }); 
});

在iframe页面中，可以使用以下代码来获取父页面传递的参数：

var id = getUrlParam('id');
console.log(id);

function getUrlParam(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  var r = window.parent.location.search.substr(1).match(reg);
  if (r != null) return unescape(r[2]);
  return null;
}

其中，getUrlParam()函数是用来获取url参数的函数，可以在其他项目中复用。

layui.opne回传数据

layui.open是Layui框架中的一个方法，用于打开一个弹出层界面。在打开弹出层界面之后，我们可以通过一些方式将数据回传给父页面。

一种常用的方法是在子页面中使用layui.layer.getChildFrame方法获取到父页面的iframe对象，然后通过iframe.contentWindow属性获取到父页面的window对象，接着可以通过window对象的某个方法将数据回传给父页面。

示例代码如下：
// 在子页面中获取到父页面的iframe对象
var parentIframe = layui.layer.getChildFrame('iframe[name=父页面iframe的name]', layerIndex);
// 获取到父页面的window对象
var parentWindow = parentIframe.contentWindow;
// 调用父页面的方法将数据回传
parentWindow.methodName(data);

在上述代码中，'父页面iframe的name'要替换成父页面iframe标签的name属性值，layerIndex是打开子页面时layer.open方法的返回值， methodName是父页面的某个方法名，data是要回传的数据。

值得注意的是，方法名和数据的传递格式需要在父页面中定义好，子页面在回传数据时需要按照父页面的要求进行处理。