最近做一个后台管理系统,用到的layui,主要是使用它的弹层,但是各个弹层之前的传值经常容易搞晕,写个个博客记录一下,方便自己,也方便别人,

首先我的页面已经嵌套了好几个iframe页面了,嵌套了三个吧,然后在第三个打开一个弹层,需要用到top.layer打开,用top之后,打开的那个弹层就位于主页上打开了(f12查看),和第三层页面不再是父子关系了.所以想在打开的弹出层页面获取第三个iframe的DOM就必须先获取到第三层的DOM.百度了好久,使用的方法就是在主页上定义一个变量,保存第三层的DOM

主页上的js

var config = { }

当打开第三个iframe的页面时,把第三层的document保存到主页上的config变量

// 第三个iframe页面的js
top.config.thirdIframe = window.document

然后在弹层页面,想要把值传到第三个iframe页面,得这么做

var thirdDocuemt = top.config.thirdIframe // 获取保存的第三个iframe的document

$('选择器',thirdDocuemt).text('要传的值');

简图

使用layui iframe弹层,各弹层之前的传值问题的更多相关文章

  1. JS中通过LayUI的layer.prompt弹出文本输入层,多个按钮回调获取输入值

    JS中通过LayUI弹出文本输入层,多个按钮回调: 如图所示,输入文本后点击通过/不通过按钮回调获取输入文本值的实现: 实现JS: layer.prompt({ formType: 2, // 弹出文 ...

  2. html+css源码之实现登录弹出框遮罩层效果

    在web开发中,很多网站都做了一些特别炫丽的效果,比如用户登录弹框遮罩层效果,本文章向大家介绍css如何实现登录弹出框遮罩层效果,需要的朋友可以参考一下本文章的源代码. html+css实现登录弹出框 ...

  3. jquery弹出关闭遮罩层实例

    jquery弹出关闭遮罩层实例. 代码如下: <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" & ...

  4. 点击按钮弹出一个div层

    JQuery弹出层,点击按钮后弹出遮罩层,还有关闭按钮 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml& ...

  5. js 带遮罩层的弹出层

    最近有个小伙伴问我关于mui的带遮罩层的弹出层,我给他发了个相关demo,但是因为他是新手的原因没有看懂,所以我写了一个单纯的原生的带遮罩层的弹出层dome.写这篇微博希望可以帮到需要的小伙伴. &l ...

  6. web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开

    https://blog.csdn.net/zgsdzczh/article/details/79744838 web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开   <style typ ...

  7. 点击文字弹出一个DIV层窗口代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  8. 【Javascript Demo】谷歌地图简单实现(附遮罩层和弹出层实现)

    虽然百度地图实现了,但只是国内的,而且前几天貌似还出问题了,对于国际的只能用谷歌地图了,所以就简单研究了下,做了个差不多的. 基本步骤,谷歌地图API文档其实写的很清楚了,先获取API密钥,然后引用j ...

  9. 【Javascript Demo】遮罩层和弹出层简单实现

    最近纠结于遮罩层和弹出层的实现,终于搞定了个简单的版本.示例和代码如下,点击按钮可以看到效果: 1.示例: 2.代码: <!DOCTYPE html PUBLIC "-//W3C//D ...

  10. jQuery点击弹出层,弹出模态框,点击模态框消失

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...

随机推荐

  1. Octavia health-manager 与 amphora 故障修复的实现与分析

    目录 文章目录 目录 Health Manager 监控 amphora 健康状态 故障转移 故障迁移测试 Health Manager Health Manager - This subcompon ...

  2. Selenium学习之==>Switch与SelectApi接口详解

    Switch 我们在UI自动化测试时,总会出现新建一个tab页面.弹出一个浏览器级别的弹框或者是出现一个iframe标签,这时我们用WebDriver提供的Api接口就无法处理这些情况了.需要用到Se ...

  3. Shiro Demo 示例(SpringMVC-Mybatis-Shiro-redis)

    Shiro Demo 准备工作 运行前申明 请看完本页面的所有细节,对你掌握这个项目来说很重要,别一上来就搞,你不爽,我也不爽. 本项目需要一定的Java功底,需要对SpringMvc,Mybatis ...

  4. 【EWM系列】SAP EWM凭证对象表概览

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[EWM系列]SAP EWM凭证对象表概览   ...

  5. 【Qt开发】设置Qt应用程序图标

    [Qt开发]设置Qt应用程序图标 标签:[Qt开发] 首先,准备一个图标,例如:zx.ico,并新建一个文本文档,在里面添加一行: IDI_ICON1 ICON DISCARDABLE"zx ...

  6. ubuntu 虚拟机安装

    ubuntu16.04.5 LTS 安装   1.下载ubuntu镜像 打开ubuntu官网镜像地址https://launchpad.net/ubuntu/+cdmirrors 在上面中搜索chin ...

  7. linux中文件IO

    一. linux常用文件IO接口 1.1. 文件描述符 1.1.1. 文件描述符的本质是一个数字,这个数字本质上是进程表中文件描述符表的一个表项,进程通过文件描述符作为index去索引查表得到文件表指 ...

  8. mysql学习记录(一)

    #打开MySQL服务 sudo service mysql start #Ubuntu Linux 安装配置MySQL #安装MySQL服务器,核心程序 sudo apt-get install my ...

  9. “程序包com.sun.tools.javac.util不存在” 问题解决

    最近工作中在编译打包项目的时候遇到了如标题所示的问题,报这个错误的类是 com.sun.tools.javac.util.Pair.问题很诡异,在Idea可以导入此类,项目启动运行也很正常,但就是在打 ...

  10. liunx驱动----信号量的实现

    使用信号量必须包含  <asm/semaphore.h>  头文件.其中相关结构体  struct semaphore 可以通过以下几种方式来声明或者初始化. 1.void sema_in ...