项目中,左侧导航树,右侧是 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. C++中写文件ofstream 的<< 操作符 与C风格的fwrite 的笔记

    在某次工作中,调用了某SDK接口,该接口通过一个回调函数返回需要的内容.我们需要的内容是H.264码流,该码流通过一个unsigned char* 变量带回,另外还有一个长度 int length.为 ...

  2. typedef 返回类型(*Function)(参数表) ——typedef函数指针

    //首先看一下函数指针怎么用 #include <iostream> using namespace std; //定义一个函数指针pFUN,它指向一个返回类型为char,有一个整型的参数 ...

  3. skywalking 6.1 简明指南

    skywalking 分布式系统的应用程序性能监视工具,专为微服务.云本机架构和基于容器(Docker.K8s.Mesos)架构而设计 背景 随着微服务架构的流行,一些微服务架构下的问题也会越来越突出 ...

  4. Sql Server 常用日期格式

    SQL Server中文版的默认的日期字段datetime格式是yyyy-mm-dd Thh:mm:ss.mmm 例如: select getdate() 2004-09-12 11:06:08.17 ...

  5. 04-spring框架—— Spring 集成 MyBatis

    将 MyBatis与 Spring 进行整合,主要解决的问题就是将 SqlSessionFactory 对象交由 Spring来管理.所以,该整合,只需要将 SqlSessionFactory 的对象 ...

  6. 关于session失效的问题(内网IP与外网IP)

    参考: 测试环境测试支付宝支付,以ip方式访问,而支付宝支付成功后回调地址配置的是域名形式的.造成支付成功后访问成功页面进入了登录页面 同一个网站,通过域名登录和通过IP登录,所产生的session是 ...

  7. 一个tornado框架下的文件上传案例

    html部分----使用了form表单,注意三要素 method="post"  action="/loaddata" enctype="multip ...

  8. 【Linux学习四】Linux下Vim命令操作

    1.Vim介绍 Vim是一个类似于Vi的著名的功能强大.高度可定制的文本编辑器,在Vi的基础上改进和增加了很多特性. 第一阶段通过vimtutor的学习,加强vim的熟练度 1.1光标移动 hjkl左 ...

  9. yum安装nginx,配置资源访问出现403Forbidden问题

    使用yum安装nginx后除了nginx自带页面其他配置页面都是403forbidden问题. 暂时的解决办法是,修该nginx配置文件中的user为root , 然后关闭seliunx或者添加ngi ...

  10. 【leetcode】1237. Find Positive Integer Solution for a Given Equation

    题目如下: Given a function  f(x, y) and a value z, return all positive integer pairs x and y where f(x,y ...