layer的iframe弹框中父子元素的传值
项目中,左侧导航树,右侧是 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弹框中父子元素的传值的更多相关文章
- layer.open弹框中的表单数据无法获取
layer.open弹框中的表单数据无法获取 表单数据模板 layer.open() 页面效果: 当点击确定后,radio和textarea获取的值总是为空,解决办法: var setPriCustB ...
- layer插件学习——弹框(自定义页)
本文是自己整理的关于layer插件的弹框样式结果 介绍: 官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自 ...
- 弹框中的elment-form在弹框重新打开后,怎么初始化验证信息
如果弹框关闭前有错误提示,弹框重新打开,由于没重新刷新页面,该错误还是存在.... 解决办法:弹框中的内容写成一个组件,prop接收父元素弹框的状态,并监听且reset表格 1. cnpm insta ...
- element-- 修改MessageBox 弹框 中确定和取消按钮顺序
需求:修改弹框中的 取消/确定按钮顺序,及头部和底部背景颜色; 原ui效果图 需求ui效果图 方法:对取消及确定按钮自定义类名,样式重写
- 在弹框中获取foreach中遍历的id值,并传递给地址栏(方法2)
1.php有时候我们需要再弹框中获取foreach中遍历的数据(例如id),在弹框中点击按钮并传递给地址栏跳转.那么应该怎么做呢.第二种方法. 2. 可以在弹框中给出一个input hidden 点击 ...
- 在弹框中获取foreach中遍历的id值,并传递给地址栏。
1.php有时候我们需要再弹框中获取foreach中遍历的数据(例如id),在弹框中点击按钮并传递给地址栏跳转.那么应该怎么做呢. 2. 点击取现按钮,如果没有设置密码->弹框 3. 点击去设置 ...
- el-dialog对话弹框中根据后台数据无限制添加el-select标签,并进行展示,搜索,删除
前几天遇到一个题,el-dialog对话弹框中根据后台数据无限制添加el-select标签,并进行展示,搜索,删除,在这上面用到了递归算法,废话不多说,直接上代码 <template> & ...
- layui layer弹框中表格的显示
场景描述:点击iframe里面的一个按钮,需要在父级弹出一个弹框表格. 问题描述:这个弹框的分页不能正常显示,如果把layer.open前面的parent去掉,就可以正常显示. 代码展示: paren ...
- Jquery如何获得<iframe>嵌套页面中的元素
DOM方法:父窗口操作IFRAME:window.frames["iframeSon"].documentIFRAME操作父窗口: window.parent.documentjq ...
随机推荐
- 基于Redis实现分布式锁(转载)
原文地址:http://blog.csdn.net/ugg/article/details/41894947 Redis命令介绍使用Redis实现分布式锁,有两个重要函数需要介绍 SETNX命令(SE ...
- HDU - 6386 Age of Moyu (双端队列+bfs)
题目链接 双端队列跑边,颜色相同的边之间的花费为0,放进队首:不同的花费为1,放进队尾. 用Dijkstra+常数优化也能过 #include<bits/stdc++.h> using n ...
- Kendo UI for jQuery使用教程:方法和事件
[Kendo UI for jQuery最新试用版下载] Kendo UI目前最新提供Kendo UI for jQuery.Kendo UI for Angular.Kendo UI Support ...
- python1-集合、函数(全局变量与局部变量)
集合(set) # s=set('hello')# print(s)## s=set(['alex','alex','sb'])# print(s) # s={1,2,3,4,5,6} #添加# s. ...
- js 多个三目运算符优先级
读JS代码遇到一段看不懂运算优先级的代码,如下 var BrowserSys = {}; var ua = navigator.userAgent.toLowerCase(); var s; (s = ...
- head first 设计模式笔记5-单例模式
目录: 1.单例模式(Singleton Pattern) 2.概念 3.饿汉式:不是延迟加载,加载类的时候直接初始化 4.懒汉式:延迟加载,首次需要使用的时候在实例化,需要考虑线程安全 5.静态内部 ...
- MessagePack Java 0.6.X 快速开始指南 - 安装
0.6.x 版本的 MessagePack 已经过期被淘汰了.如果你现在开始使用 MessagePack 话,请不要使用这个版本. 我们再这里保留 0.6.x 版本的内容主要用于参考用途. 最新的 M ...
- 暑假集训 #2 div1 I - Lada Priora 精度处理
I - Lada Priora Time Limit:1000MS Memory Limit:65536KB 64bit IO Format:%I64d & %I64u Sub ...
- [NLP] The Annotated Transformer 代码修正
1. RuntimeError: "exp" not implemented for 'torch.LongTensor' class PositionalEncoding(nn. ...
- crontab 常见 /dev/null 2>&1 详解
大部分在 crontab 计划任务中都会年到未尾带 >/dev/null 2>&1,是什么意思呢? > 是重定向 /dev/null 代表空设备文件 1 表示stdout标准 ...