详解layui弹窗父子窗口之间传参数的方法


Posted in Javascript onJanuary 16, 2018

本文介绍了layui弹窗父子窗口之间传参数的方法,分享给大家,具体如下:

1、父页面打开子页面并向子页面传参数

function setChooseValues(ret){  
    var oView = document.getElementById("userName");  
    var oValue = document.getElementById("userIds");  
    var i = 0;  
    if( ret != null){  
      oValue.value="";  
      oView.value="";  
      oView.title="";  
      for( x in ret){  
        i++;  
        oView.title=oView.title + ret[x].name+",";  
        oValue.value=oValue.value+ret[x].id+",";  
        oView.value = oView.value+ret[x].name+"\n";  
      }  
      if(i==0){  
        oView.value="";  
      }  
    }  
  }  
  function OpenFrame( oValue, oView) {  
    var dialogArgumentsA = new Array(oValue.value , spitToString(oView));  
    var url = "${rootPath}/page/system/roleallot/role_allot.jsp";  
    layer.open({  
      type: 2,  
      skin: 'layui-layer-lan',  
      title: '选择人员',  
      fix: false,  
      shadeClose: false,  
      maxmin: true,  
      id:'selectUser',  
      move: false,  
      closeBtn:2,  
      //以下代码为打开窗口添加按钮  
      /* btn: ['确定', '取消'], 
      btnAlign: 'c', 
      yes: function(index, layero){ 
        /* //layer.closeAll();//关闭所有弹出层 
        //var parentWin = layero.find('iframe')[0]; 
        var parentWin = layer.getChildFrame('body', index); 
        alert(parentWin); 
        parentWin.contentWindow.doOk(); 
        //layer.close(index);//这块是点击确定关闭这个弹出层 
      }, */  
      area: ['750px', '450px'],  
      content: url,  
      success: function(layero, index){  
        var body = layer.getChildFrame('body', index);  
        var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象,执行iframe页的方法:iframeWin.method();  
        var ids = dialogArgumentsA[0].split(",");  
        var names = dialogArgumentsA[1].split(",");  
        for (var i = 0; i < ids.length; i++ ) {  
          if ('' != ids[i]) {  
            var option = $("<option>").val(ids[i]).text(names[i]);  
            body.find('select').append(option);  
          }  
        }  
      }  
    });  
  }

2、子页面向父页面传参数并关闭弹窗

function newBuildReturnValue(selectName){ 
  var ret = new Array();  
 
     $("#"+selectName+" option").each(function(){ 
 
     //遍历所有option   
       var value = $(this).val();  //获取option值    
       var text = $(this).text();  
       if(text!=''){    
         var o = new Element(value, text, 0);  
        ret.push(o);  
       }   
    });  
   return ret;  
  }  
  //点击确定向子页面传参并关闭窗口  
  function doOk(){  
    var ret = newBuildReturnValue("select");  
    parent.setChooseValues(ret);  
    var index = parent.layer.getFrameIndex(window.name);  
    parent.layer.close(index);  
  }  
    
  //点击取消关闭窗口  
    
  function doCancel(){  
    var index = parent.layer.getFrameIndex(window.name);  
    parent.layer.close(index);  
  }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于JQuery的浮动DIV显示提示信息并自动隐藏
Feb 11 Javascript
js修改table中Td的值(定义td的单击事件)
Jan 10 Javascript
ScrollDown的基本操作示例
Jun 09 Javascript
解析JSON对象与字符串之间的相互转换
Dec 18 Javascript
javascript实现 百度翻译 可折叠的分享按钮列表
Mar 12 Javascript
js通过iframe加载外部网页的实现代码
Apr 05 Javascript
JavaScript中Math.SQRT2属性的使用详解
Jun 14 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
JQuery 传送中文乱码问题的简单解决办法
May 24 Javascript
JavaScript实现打印星型金字塔功能实例分析
Sep 27 Javascript
Taro集成Redux快速上手的方法示例
Jun 21 Javascript
vue实现购物车的小练习
Dec 21 Vue.js
微信小程序实现image组件图片自适应宽度比例显示的方法
Jan 16 #Javascript
基于VUE移动音乐WEBAPP跨域请求失败的解决方法
Jan 16 #Javascript
AngularJS监听ng-repeat渲染完成的两种方法
Jan 16 #Javascript
微信小程序实现流程进度的图样式功能
Jan 16 #Javascript
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
Jan 16 #Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
Jan 16 #Javascript
详解layui中的树形关于取值传值问题
Jan 16 #Javascript
You might like
PHP中for循环语句的几种变型
2006/11/26 PHP
PHP优于Node.js的五大理由分享
2012/09/15 PHP
基于PHP生成静态页的实现方法
2013/05/10 PHP
Yaf框架封装的MySQL数据库操作示例
2019/03/06 PHP
PHP设计模式之 策略模式Strategy详解【对象行为型】
2020/05/01 PHP
Swoole扩展的6种模式深入详解
2021/03/04 PHP
javascript面向对象之二 命名空间
2011/02/08 Javascript
javascript克隆对象深度介绍
2012/11/20 Javascript
JavaScript实现将UPC转换成ISBN的方法
2015/05/26 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
2016/08/03 Javascript
easyui form validate总是返回false的原因及解决方法
2016/11/07 Javascript
js闭包用法实例详解
2016/12/13 Javascript
JavaScript模拟文件拖选框样式v1.0的实例
2017/08/04 Javascript
微信小程序实现图片懒加载的示例代码
2017/12/13 Javascript
React项目动态设置title标题的方法示例
2018/09/26 Javascript
浅谈layer的Icon样式以及一些常用的layer窗口使用方法
2019/09/11 Javascript
[05:26]2014DOTA2西雅图国际邀请赛 iG战队巡礼
2014/07/07 DOTA
[00:19]CN DOTA NEVER DIE!VG夺冠rOtK接受采访
2019/12/23 DOTA
python实现在每个独立进程中运行一个函数的方法
2015/04/23 Python
深入探究Python中变量的拷贝和作用域问题
2015/05/05 Python
Python的pycurl包用法简介
2015/11/13 Python
Pandas读取MySQL数据到DataFrame的方法
2018/07/25 Python
Pytorch加载部分预训练模型的参数实例
2019/08/18 Python
Python GUI库PyQt5样式QSS子控件介绍
2020/02/25 Python
Canvas制作旋转的太极的示例
2018/03/09 HTML / CSS
波兰在线杂货店:Polski Koszyk
2019/11/02 全球购物
护士自我鉴定范文
2013/10/06 职场文书
优秀党支部事迹材料
2014/01/14 职场文书
幼儿园春季开学寄语
2014/04/03 职场文书
异地年检委托书范本
2014/09/24 职场文书
志愿者个人总结
2015/03/03 职场文书
调解书格式范本
2015/05/20 职场文书
三好学生竞选稿
2015/11/21 职场文书
幼儿园2016年感恩节活动总结
2016/04/01 职场文书
2019最新婚庆对联集锦!
2019/07/10 职场文书