需求:最外面列表界面点修改弹出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弹层(父子传值,兄弟传值)的更多相关文章

  1. 学习layer弹层组件移动版

    layer弹层组件官网 常用参数: shadeClose:默认true,是否点击遮罩时关闭层

  2. jQuery Layer 弹层组件

    layer是一款近年来口碑非常不错的web弹层组件,她具备全方位的解决方案,致力于服务各个水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 在与同类组件的比较中,layer总是能轻易获胜.她 ...

  3. layer弹层基本参数初尝试

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. layer弹层插件

      // 使用前需要引入jquery的支持,链接如下:   https://blog-static.cnblogs.com/files/liguanlong/jquery1.9.1.min.js    ...

  5. Layer弹层组件 二次扩展,项目中直接使用。

    /************************ Layer扩展 ****************************/ /* * Layer弹出Alert提示框 * @param messag ...

  6. layer弹层

    获得 layer 文件包后,解压并将 layer 整个文件夹(不要拆分结构) 存放到你项目的任意目录,使用时,只需引入 layer.js 即可. 注意:引入layer.js前必须先引入jquery1. ...

  7. HTML5 本地存储+layer弹层组件制作记事本

    什么是 HTML5 Web 存储? 使用HTML5可以在本地存储用户的浏览数据. 早些时候,本地存储使用的是 cookie.但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上,但是这 ...

  8. layer弹层content写错导致div复制了一次,导致id失效 $().val() 获取不到dispaly:none div里表单的值

    ​ 错误之源: $("a.consult").click(function () {         lib_consult_html = $('#consult-html').h ...

  9. layer弹出层传值到父页面

    目前做的项目中用到layer弹层传值,弹层输入框输入文本,点击确定按钮,父页面的树结构,会自动添加分组. 在此粘贴下代码,以后遇到,方便回忆,如有疑问请留言,或许会为您解答 $(document).r ...

随机推荐

  1. Java和Tomcat安装教程

    jdk安装与配置1.下载好对应的jdk2.安装JDK 直接运行exe可执行程序,默认安装即可:备注:路径可以选其他盘符,路径要全部为英文. 3.配置环境变量 新建变量名:JAVA_HOME,变量值:D ...

  2. RANSAC简史

    前言 在进行泡泡机器人[图灵智库]栏目的翻译的过程中,我发现在2018-2019的顶会中,依然有很多文章(我看到的不少于6篇)对RANSAC进行各种改进,这令我感到很吃惊.毕竟该方法在1981年就被提 ...

  3. input 上传图片

    <!--多图上传--><input name="image_mortgage_property[]" type="file" multiple ...

  4. 设计模式(C#)——03建造者模式

    推荐阅读:  我的CSDN  我的博客园  QQ群:704621321       当一个复杂对象由一些子对象构成,并且子对象的变化会导致复杂对象的修改.这时我们需要提供一种"封装机制&qu ...

  5. 边缘缓存模式(Cache-Aside Pattern)

    边缘缓存模式(Cache-Aside Pattern),即按需将数据从数据存储加载到缓存中.此模式最大的作用就是提高性能减少不必要的查询. 1 模式 先从缓存查询数据 如果没有命中缓存则从数据存储查询 ...

  6. python控制窗口口字形运动

    import win32con import win32gui import time import math notepad = win32gui.FindWindow("Photo_Li ...

  7. URAL-1627-Join 生成树计数

    传送门:https://vjudge.net/problem/URAL-1627 题意: 给定一个n*m的图,问图中“.”的点生成的最小生成树有多少个. 思路: 生成树的计数,需要用Kirchhoff ...

  8. 牛客小白月赛6 水题 求n!在m进制下末尾0的个数 数论

    链接:https://www.nowcoder.com/acm/contest/135/C来源:牛客网 题目描述 其中,f(1)=1;f(2)=1;Z皇后的方案数:即在Z×Z的棋盘上放置Z个皇后,使其 ...

  9. Codeforces 734C. Anton and Making Potions(二分)

    Anton is playing a very interesting computer game, but now he is stuck at one of the levels. To pass ...

  10. kick start 2019 round D T2题解

    题目大意:由N个房子围成一个环,G个人分别顺时针/逆时针在房子上走,一共走M分钟,每分钟结束,每个人顺/逆时针走到相邻的房子.对于每个房子都会记录最后时刻到达的人(可能是一群人).最终输出每个人会被几 ...