Layer弹层(父子传值,兄弟传值)
需求:最外面列表界面点修改弹出LayerA界面,再点击LayerA界面中的选择地图坐标按钮弹出LayerB地图界面
这个过程涉及到的:
1:LayerA将坐标传给LayerB,LayerB在地图上显示坐标。
2:LayerB选完坐标点击确定后,地图关闭,LayerB将坐标传回LayerA

列表界面点击修改按钮弹出LayerA界面

LayerB界面点击弹出地图事件

LayerB地图界面点击确定传值给LayerA

1:LayerA与LayerB是什么关系?
兄弟关系,如果是父子关系,子的页面会嵌套在父页面里,无法实现子页面比父页面大
关键代码:
parent.layer.open(options);//点击LayerB按钮时,以兄弟页面的形式弹出
2:如何将LayerB地图上坐标的值传给LayerA
监听地图,将点击的坐标传给页面上的一个label保存,在提交的时候读取labael,并通过jq的以id来拿到frame元素的方式,将label的值赋值给兄弟页面的一个文本框里。
关键代码:
var i = $("#lb1").val();
$(parent.frames["Form"].document).find("#AreaPoint").val(i);//LayerB的Frame的id 叫Form,事先在layer的id属性里定义过了
var index = parent.layer.getFrameIndex(window.name);//获取当前页面的name 即HomePeopleForm 都是通过父页面(即列表页)来操作子页面里的元素
parent.layer.close(index);
Layer弹层(父子传值,兄弟传值)的更多相关文章
- 学习layer弹层组件移动版
layer弹层组件官网 常用参数: shadeClose:默认true,是否点击遮罩时关闭层
- jQuery Layer 弹层组件
layer是一款近年来口碑非常不错的web弹层组件,她具备全方位的解决方案,致力于服务各个水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 在与同类组件的比较中,layer总是能轻易获胜.她 ...
- layer弹层基本参数初尝试
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- layer弹层插件
// 使用前需要引入jquery的支持,链接如下: https://blog-static.cnblogs.com/files/liguanlong/jquery1.9.1.min.js ...
- Layer弹层组件 二次扩展,项目中直接使用。
/************************ Layer扩展 ****************************/ /* * Layer弹出Alert提示框 * @param messag ...
- layer弹层
获得 layer 文件包后,解压并将 layer 整个文件夹(不要拆分结构) 存放到你项目的任意目录,使用时,只需引入 layer.js 即可. 注意:引入layer.js前必须先引入jquery1. ...
- HTML5 本地存储+layer弹层组件制作记事本
什么是 HTML5 Web 存储? 使用HTML5可以在本地存储用户的浏览数据. 早些时候,本地存储使用的是 cookie.但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上,但是这 ...
- layer弹层content写错导致div复制了一次,导致id失效 $().val() 获取不到dispaly:none div里表单的值
错误之源: $("a.consult").click(function () { lib_consult_html = $('#consult-html').h ...
- layer弹出层传值到父页面
目前做的项目中用到layer弹层传值,弹层输入框输入文本,点击确定按钮,父页面的树结构,会自动添加分组. 在此粘贴下代码,以后遇到,方便回忆,如有疑问请留言,或许会为您解答 $(document).r ...
随机推荐
- 第一次接触Linux
一:文件目录操作命令 (一)创建文件 vim 文件名 按i进入插入模式 写完文件后,先按Esc, 再输入 :w ...
- hive concat_ws源代码
其他相关源码可以到以下链接查看: https://github.com/apache/hive/tree/master/ql/src/java/org/apache/hadoop/hive/ql/ud ...
- net core WebApi——文件分片上传与跨域请求处理
目录 前言 开始 测试 跨域 小结 @ 前言 在之前整理完一套简单的后台基础工程后,因为业务需要鼓捣了文件上传跟下载,整理完后就迫不及待的想分享出来,希望有用到文件相关操作的朋友可以得到些帮助. 开始 ...
- 打包Electron项目
先确保该项目正常运行npm run dev,结束程序, 上篇的项目运行已经提到了打包输出工具electron-packager 可以使用全局安装的方式: npm install -g electron ...
- 学会了这些技术,你离BAT大厂不远了
每一个程序员都有一个梦想,梦想着能够进入阿里.腾讯.字节跳动.百度等一线互联网公司,由于身边的环境等原因,不知道 BAT 等一线互联网公司使用哪些技术?或者该如何去学习这些技术?或者我该去哪些获取这些 ...
- Scrum 工件: 速度图和燃尽图
速度图 Velocity用于衡量scrum团队持续提供业务价值的速度,可以采用历史估算的方法,衡量一个又一个sprint的速度.团队通过跟踪完成达到自己团队完成标准的故事点的数量,就可以基于相对点值对 ...
- mysql/mariadb 初体验
距离申请这个博客号已经过了九个月,思前想后还是把知识沉淀放这里吧,不过初心一样,依旧是 '谨以此文,见证成果'.有 兴趣的话也欢迎大家去我的csdn博客转一转.以下是正文: 1.mysql安装 win ...
- Leetcode之二分法专题-744. 寻找比目标字母大的最小字母(Find Smallest Letter Greater Than Target)
Leetcode之二分法专题-744. 寻找比目标字母大的最小字母(Find Smallest Letter Greater Than Target) 给定一个只包含小写字母的有序数组letters ...
- [翻译] C# 8.0 接口默认实现
原文: Default implementations in interfaces 随着上周的 .NET Core 3.0 Prview 5 和 Visual Studio 2019 version ...
- javascript JS CryptoJS DES加解密CBC模式与C#DES加解密相同互通
我们只知道不同的语言解密要相互通用,就需要遵循相同的加密方式,然而在具体做技术预研的时候,就发现会遇到很多问题,网上找的资料也是比较片面,所以我踩了坑,并且把解决方案和相关资料源码提供出来,给需要的朋 ...