最近做一个后台管理系统,用到的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. 2019暑假第二周(hadoop在个人电脑上的搭建)

    一,Hadoop和NoSQL数据库的学习,大多需要Linux环境. 搭建Linux环境可以分为两种方式: (1)在电脑上安装双操作系统,即同时安装Linux和Windows操作系统,在电脑启动的时候, ...

  2. Pytorch搭建卷积神经网络用于MNIST分类

    import torch from torch.utils.data import DataLoader from torchvision import datasets from torchvisi ...

  3. ubuntu18.04 安装mongodb并使用Robo 3T连接Mongodb数据库

    1.前提: 系统:ubuntu18.04  64位 数据库:mongodb GUI:Robo 3T  2018.3.0 描述: mongodb 安装在局域网内的ubuntu的机子上面,  在win 下 ...

  4. finereport连接mysql8.0的解决办法

    1.具体连接操作 首先将mysql-connector-java-8.0以上的jar包放到FindReport安装目录下的webapps下的WEB-INF下的lib下. 打开finereport,找到 ...

  5. scala 使用case 关键字定义类不需要创建对象直接调用

    1.必须是使用case 定义object类 package config import org.apache.spark.sql.SparkSession import org.apache.spar ...

  6. DataAdapter的Fill方法(转)

    使用DataAdapter填充DataSet(1) 在选择了DataAdapter的类型(SqlDataAdapter或OleDbDataAdapter)并配置了DataAdapter来执行所需的任务 ...

  7. python 并发编程 多进程 Process对象的其他属性方法 join 方法

    一 Process对象的join方法 在主进程运行过程中如果想并发地执行其他的任务,我们可以开启子进程,此时主进程的任务与子进程的任务分两种情况 情况一: 在主进程的任务与子进程的任务彼此独立的情况下 ...

  8. python深度学习培训概念整理

    对于公司组织的人工智能学习,每周日一天课程共计五周,已经上了三次,一天课程下来讲了两本书的知识.发现老师讲的速度太快,深度不够,而且其他公司学员有的没有接触过python知识,所以有必要自己花时间多看 ...

  9. Java简易实现记事本的打开与保存

    记事本的打开与保存 一些总结 * Swing中有时方法不显示,需要把方setVisible(true)放到最后执行 * AWT中的TextArea默认是中间布局 * fileDialog对话框Load ...

  10. [转帖] 百度百科 sino

    sino https://baike.baidu.com/item/sino/2830?fr=aladdin 百度百科 sinograin 中储粮 (组合词前缀) 编辑 讨论 Sino,就是「中国.东 ...