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 ...
随机推荐
- 结合suctf-upload labs-RougeMysql再学习
这篇主要记录一下这道题目的预期解法 做这道题首先要在自己的vps搭建一个rouge mysql,里面要填写需要读取客户端的文件名,即我们上传的phar文件路径 先搭一个rouge mysql测试看看: ...
- @RequestBody 注意的问题
contentType : "application/json", //只能是这个 RequestBody 不能和form/data共存: @RequestMapping(valu ...
- springcloud(九):熔断器Hystrix和Feign的全套应用案例(二)
一.. 创建Eureka-Server 服务中心项目 1. 创建Eureka-Server 服务中心项目架构如下 2. pom.xml <dependencies> <depende ...
- 使用maven搭建ssm框架环境
1.前言 因为经常换环境,在搭ssm框架的时候老是出错,所以记录一下最近搭建的环境,以供参考. 本文讲解如何使用maven搭建ssm框架,并能用于简单的登录注册. IDE:IDEA,JDK版本:1.8 ...
- CentOS -- Zookeeper installation and configure
1 JDK 1.8 must installed first 2 Get Zookeeper package wget https://archive.apache.org/dist/zookeepe ...
- 一文搞懂transform: skew
如何理解斜切skew,先看一个demo.在下面的demo中,有4个正方形,分别是 红色:不做skew变换, 绿色:x方向变换, 蓝色:y方向变换, 黑色:两个方向都变换, 拖动下面的滑块可以查看改变s ...
- 自制轮子 canvas tree
这是树的效果 这个树拥有的功能有 1.小地图显示 2.小地图点击快速定位 3.点击加减显示根节点 4.基本的数显示 5.节点拖拽 6.点击头像跳转到相关页面 7.使用直角线和直线选择 8.画布自适应 ...
- HDU5988 - 2016icpc青岛 - G - Coding Contest 费用流(利用对数化乘为加
HDU5988 题意: 有n个区域,每个区域有s个人,b份饭.现在告诉你每个区域间的有向路径,每条路有容量和损坏路径的概率.问如何走可以使得路径不被破坏的概率最小.第一个人走某条道路是百分百不会损坏道 ...
- POJ-1325 Machine Schedule 二分图匹配 最小点覆盖问题
POJ-1325 题意: 有两台机器A,B,分别有n,m种模式,初始都在0模式,现在有k项任务,每项任务要求A或者B调到对应的模式才能完成.问最少要给机器A,B调多少次模式可以完成任务. 思路: 相当 ...
- 2018 Petrozavodsk Winter Camp, Yandex Cup
A. Ability Draft solved by RDC 60min start, 148 min AC, 1Y 题意:两只 Dota 队伍,每队 \(n\) 个英雄,英雄一开始无技能,他们需要按 ...