项目中,左侧导航树,右侧是 iframe 嵌套的页面,在右侧页面中又有layer弹框,可以说是有两层 iframe 框架。

所以查询网上的parent什么的方法都不能用。自己摸索的下面的方法:

1、父页面取子页面的值:

 top.moreFunLayer = top.layer.open({
type: 2,
title: "常用功能",
area: ["600pt", "150pt"],
content: './workbench/comUseFunc_add.html',
success: function(layero, index) {
// console.log(index);
console.log(layero);
console.log(layero[0]);
console.log(typeof layero[0]);
console.log( $(layero[0]).find("#layui-layer-iframe"+index).contents().find("#btn").val() );
console.log(layero[0] instanceof jQuery);
console.log(layero[0] instanceof HTMLElement);
}
});

2、子页面取父页面的值

 $("#btn").click(()=>{
console.log("子页面button触发");
$(parent.document.getElementsByClassName("J_iframe")[0]).attr("src");
console.log( $(parent.document.getElementsByClassName("J_iframe")[0]).contents().find("#div").html() );
})

总结:

1、子页面要是想取父页面中的js数据,可以在页面中设置一个display为none的div元素或者隐藏的输入框。然后把数据赋值给看不见的元素,然后子页面取父页面的元素值。

2、取元素值的时候,中间间隔的有 iframe 元素的话,必须先定位 iframe 元素,然后取 iframe 元素内容,再定位元素。

layer的iframe弹框中父子元素的传值的更多相关文章

  1. layer.open弹框中的表单数据无法获取

    layer.open弹框中的表单数据无法获取 表单数据模板 layer.open() 页面效果: 当点击确定后,radio和textarea获取的值总是为空,解决办法: var setPriCustB ...

  2. layer插件学习——弹框(自定义页)

    本文是自己整理的关于layer插件的弹框样式结果 介绍: 官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自 ...

  3. 弹框中的elment-form在弹框重新打开后,怎么初始化验证信息

    如果弹框关闭前有错误提示,弹框重新打开,由于没重新刷新页面,该错误还是存在.... 解决办法:弹框中的内容写成一个组件,prop接收父元素弹框的状态,并监听且reset表格 1. cnpm insta ...

  4. element-- 修改MessageBox 弹框 中确定和取消按钮顺序

    需求:修改弹框中的 取消/确定按钮顺序,及头部和底部背景颜色; 原ui效果图 需求ui效果图 方法:对取消及确定按钮自定义类名,样式重写

  5. 在弹框中获取foreach中遍历的id值,并传递给地址栏(方法2)

    1.php有时候我们需要再弹框中获取foreach中遍历的数据(例如id),在弹框中点击按钮并传递给地址栏跳转.那么应该怎么做呢.第二种方法. 2. 可以在弹框中给出一个input hidden 点击 ...

  6. 在弹框中获取foreach中遍历的id值,并传递给地址栏。

    1.php有时候我们需要再弹框中获取foreach中遍历的数据(例如id),在弹框中点击按钮并传递给地址栏跳转.那么应该怎么做呢. 2. 点击取现按钮,如果没有设置密码->弹框 3. 点击去设置 ...

  7. el-dialog对话弹框中根据后台数据无限制添加el-select标签,并进行展示,搜索,删除

    前几天遇到一个题,el-dialog对话弹框中根据后台数据无限制添加el-select标签,并进行展示,搜索,删除,在这上面用到了递归算法,废话不多说,直接上代码 <template> & ...

  8. layui layer弹框中表格的显示

    场景描述:点击iframe里面的一个按钮,需要在父级弹出一个弹框表格. 问题描述:这个弹框的分页不能正常显示,如果把layer.open前面的parent去掉,就可以正常显示. 代码展示: paren ...

  9. Jquery如何获得<iframe>嵌套页面中的元素

    DOM方法:父窗口操作IFRAME:window.frames["iframeSon"].documentIFRAME操作父窗口: window.parent.documentjq ...

随机推荐

  1. 关于cli打包至服务器出现的BUG(样式错乱,路径出错)解决方案

    很久没来博客园了,今天给大家带来两个硬货bug,前端大牛可能不觉得是啥,但是对于没碰到过这问题的小菜鸟我来说还是很不错的 1.npm run build 至服务端的时候出现路径报错解决方案 ①.本地测 ...

  2. leetcode二刷结束

    二刷对一些常见的算法有了一些系统性的认识,对于算法的时间复杂度以及效率有了优化的意识,对于简单题和中等题目不再畏惧.三刷加油

  3. 多线程-生产者消费者(BlockingQueue实现)

    三.采用BlockingQueue实现 BlockingQueue也是java.util.concurrent下的主要用来控制线程同步的工具. BlockingQueue有四个具体的实现类,根据不同需 ...

  4. MongoDB学习笔记之文档

    #向集合中插入文档有两种方式(insert.save) db.col.insert({title: 'MongoDB 教程', description: 'MongoDB 是一个 Nosql 数据库' ...

  5. SQL Server判断表中某字段是否存在【转】

    --比如说要判断表A中的字段C是否存在两个方法: 一, IF EXISTS ( FROM SYSOBJECTS T1 INNER JOIN SYSCOLUMNS T2 ON T1.ID=T2.ID W ...

  6. 如何配置IIS使其支持APK/WGT文件的下载

    1.打开Internet 信息服务(IIS)管理器: 2.选择需要配置的网站: 3.右侧功能界面双击进入“MIME类型”: 4.点击右侧“添加”按钮,在弹出窗口里文件扩展名输入:apk,MIME类型输 ...

  7. ES使用中的总结整理

    最近项目中使用了ES搜索,开始时自己搭建了ES环境做测试,后面申请了公司的云平台应用, 对接ES的过程中颇具波折,遇到了很多问题,在这里统一整理记录下: 1,ES的9200 及 9300端口说明 92 ...

  8. Eclipse中文件结构的树形显示问题

    问题描述:在Eclipse中的SpringBoot文件显示层级消失. 这种情况下编辑代码的效率大大下降. 原因:Eclipse的工作模式不正确.上面的工作模式是Java模式.实际上应采用JavaEE模 ...

  9. 2018 焦作网络赛 L Poor God Water ( AC自动机构造矩阵、BM求线性递推、手动构造矩阵、矩阵快速幂 )

    题目链接 题意 : 实际上可以转化一下题意 要求求出用三个不同元素的字符集例如 { 'A' .'B' .'C' } 构造出长度为 n 且不包含 AAA.BBB CCC.ACB BCA.CAC CBC ...

  10. Codeforces Round #303 (Div. 2) D. Queue 水题贪心

    题目: 题意:给你n个数值,要求排列这个序列使得第k个数值的前K-1个数的和>=第k个数值的个数尽可能多: #include <iostream> #include <cstd ...