zoukankan      html  css  js  c++  java
  • layer子层给父层页面元素赋值,以达到向父层页面传值的效果

    父层:

    jsp中:

    //页面上添加一个隐藏的输入框待用于被子层设置value,从而将子层的数据传递到此页面

    <input type="hidden" id="getValue" name="getValue" value="" />

    js代码:

    //设置function,当执行时,弹出子窗口并传递当前窗口名称

      //弹出子窗口(选择商家)
        function choseMerchant() {
    
            //获取当前窗口名称
            var parentName= window.name;
    
            /*(由于用的ssm框架)URL对应的是controller方法,并向其传递当前窗口名称,打开的窗口显示页面即              
            为经过controller方法后返回的页面*/
            var url = root + "/adPosition/choseMerchant?parentName="+ parentName;
    
            laySum = parent.layer.open({
                //设置打开的子窗口效果
                type : 2,
                title : "选择商家",
                shadeClose : true,
                shade : 0.5,
                shift : 0,
                area : [ '40%', '863px' ],
                content : url,
                success: function(layero, index){   
                }
            });
        }

    子层:

    jsp中:

    //页面添加的隐藏输入框,存储的值是经过controller方法后返回的父窗口名称,用于区分,将id设置为mainIframeName

    <input type="hidden" id="mainIframeName" name="mainIframeName" value="${parentName}">

    js代码:

    //设置function,当执行时,传值并关闭当前窗口

    function setvalue() {
    
          //得到“mainIframeName”输入框中存储的值
          var mainIframeName = $("#mainIframeName").val();
    
          //判断是否为空或者是未定义
          if (mainIframeName != "" && mainIframeName != "undefined") 
          {
          //此处的ifrc和winc的意义可自行查阅
          var ifrc = window.parent.frames[mainIframeName];
          var winc = ifrc.window || ifrc.contentWindow;
          try {
              //设置父窗口隐藏输入框的值为hello world
              winc.document.getElementById("getValue").value = "hello world!";
              } catch (ex) {
                   winc.location.reload();
              }
           }
                //关闭当前窗口
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
        }

    总结:此方法用于子层直接给父层元素赋值,从而达到传值的效果,关键点在于需要将父层窗口名称传递到子层中。

    2017-09-21 22:48:33

    作者:YancyMauno
    出处:http://www.cnblogs.com/Mauno/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则保留追究法律责任的权利。

  • 相关阅读:
    【节流】在vue的搜寻功能中使用节流
    【本地存储】将数据存储到本地 (sessionStorage、vuex)
    【react】 react---项目的-----------简单路由配置
    观察者模式
    vue-awesome-swiper 的安装和使用
    BetterScroll、移动端、滚动事件,如何使用
    永乐接口
    Linux命令
    对称加密和非对称加密
    小程序
  • 原文地址:https://www.cnblogs.com/Mauno/p/7571800.html
Copyright © 2011-2022 走看看