zoukankan      html  css  js  c++  java
  • 获取layer.open弹出层的返回值

    正在开发的车联网项目用到了layer API。当我在开发“新建电子围栏”的时候需要弹出地图,用户在地图中画一个区域,最后将这个弹出层的数据返回给原页面。下面是我的实现过:程:

    触发弹出层的代码:

                    layer.open({
                        type: 2,
                        title: "设置围栏",
                        shadeClose: true,
                        shade: 0.4,
                        area: ['90%', '90%'],
                        content: "/ElectronicFence/Map?id=" + id + "&shapeType=" + shapeType,
                        btn: ['确定','关闭'],
                        yes: function(index){
                            //当点击‘确定’按钮的时候,获取弹出层返回的值
                            var res = window["layui-layer-iframe" + index].callbackdata();
                            //打印返回的值,看是否有我们想返回的值。
                            console.log(res);
                            //最后关闭弹出层
                            layer.close(index);
                        },
                        cancel: function(){
                            //右上角关闭回调
                        }
                    });

    注意:

    var res = window["layui-layer-iframe" + index].callbackdata();
    这行代码中‘
    callbackdata’是弹出层里面定义的函数。也许我们知道了什么!这个函数的作用就是返回值。

    弹出层中定义返回值的函数:

        <script type="text/javascript">
            var map = new AMap.Map("container", {
                resizeEnable: true
            });
            //在地图中添加MouseTool插件
            var mouseTool = new AMap.MouseTool(map);
            AMap.event.addDomListener(document.getElementById('point'), 'click', function () {
                mouseTool.marker({ offset: new AMap.Pixel(-14, -11) });
            }, false);
            AMap.event.addDomListener(document.getElementById('line'), 'click', function () {
                mouseTool.polyline();
            }, false);
            AMap.event.addDomListener(document.getElementById('polygon'), 'click', function () {
                mouseTool.polygon();
            }, false);
    
    
            var callbackdata = function () {
                var data = {
                    username: 'zhangfj'
                };
                return data;
            }
        </script>

    上面的代码就是弹出层里面的JavaScript代码,里面定义了函数'callbackdata' 用来返回值给调用弹出层的页面。

    当我们点击弹出层的“确定”按钮的时候,就可以通过'callbackdata'函数获取弹出层的返回值:

     F12 查看console.log(res);的输出结果:

  • 相关阅读:
    Windows Server 2012配置开机启动项
    Windows Server 2019 SSH Server
    NOIP2017 senior A 模拟赛 7.7 T1 棋盘
    Noip 2015 senior 复赛 Day2 子串
    Noip 2015 senior复赛 题解
    Noip 2014 senior Day2 解方程(equation)
    Noip 2014 senior Day2 寻找道路(road)
    Noip 2014 senior Day2 无线网络发射器选址(wireless)
    Noip2014senior复赛 飞扬的小鸟
    Noip 2014 senior 复赛 联合权值(link)
  • 原文地址:https://www.cnblogs.com/fjzhang/p/6232148.html
Copyright © 2011-2022 走看看