layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例


Posted in Javascript onSeptember 22, 2017

父层:

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);
 }

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

以上就是小编为大家带来的layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例的全部内容了,希望大家喜欢哦~

如果大家想了解更多游戏活动与游戏攻略,请持续关注本站,本站小编将在第一时间为大家带来最好看、最好玩、最新鲜的游戏资讯。更多精彩内容,尽在3water游戏频道!

Javascript 相关文章推荐
javascript中substr,substring,slice.splice的区别说明
Nov 25 Javascript
深入了解Node.js中的一些特性
Sep 25 Javascript
jquery图片轮播特效代码分享
Apr 20 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
Jan 04 Javascript
基于JS实现EOS隐藏错误提示层代码
Apr 25 Javascript
Vue2.0 从零开始_环境搭建操作步骤
Jun 14 Javascript
mac上node.js环境的安装测试
Jul 03 Javascript
JavaScript门面模式详解
Oct 19 Javascript
echarts学习笔记之箱线图的分析与绘制详解
Nov 22 Javascript
webpack-dev-server自动更新页面方法
Feb 22 Javascript
Angular实现svg和png图片下载实现
May 05 Javascript
JS精确判断数据类型代码实例
Dec 18 Javascript
js表单序列化判断空值的实例
Sep 22 #Javascript
VUE中的无限循环代码解析
Sep 22 #Javascript
详解vue中引入stylus及报错解决方法
Sep 22 #Javascript
EL表达式截取字符串的函数说明
Sep 22 #Javascript
js中json对象和字符串的理解及相互转化操作实现方法
Sep 22 #Javascript
利用javascript如何随机生成一定位数的密码
Sep 22 #Javascript
ES6中新增的Object.assign()方法详解
Sep 22 #Javascript
You might like
mysql 字段类型说明
2007/04/27 PHP
获取用户Ip地址通用方法与常见安全隐患(HTTP_X_FORWARDED_FOR)
2013/06/01 PHP
PHP使用静态方法的几个注意事项
2014/09/16 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
基于php数组中的索引数组和关联数组详解
2018/03/12 PHP
PHP 中 var_export、print_r、var_dump 调试中的区别
2018/06/19 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
轻轻松松学习JavaScript
2007/02/25 Javascript
node.js中的querystring.stringify方法使用说明
2014/12/10 Javascript
基于jquery实现简单的手风琴特效
2015/11/24 Javascript
AngularJS实现Model缓存的方式
2016/02/03 Javascript
jquery插件Jplayer使用方法简析
2016/04/22 Javascript
jQuery Mobile操作HTML5的常用函数总结
2016/05/17 Javascript
Vue.js创建Calendar日历效果
2016/11/03 Javascript
AngularJS实现表单验证功能
2017/01/09 Javascript
微信小程序 转发功能的实现
2017/08/04 Javascript
js实现图片上传并预览功能
2018/08/06 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
2020/02/10 Javascript
浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑
2020/09/12 Javascript
Linux下使用python调用top命令获得CPU利用率
2015/03/10 Python
python字符串中的单双引
2017/02/16 Python
python 如何快速找出两个电子表中数据的差异
2017/05/26 Python
Django管理员账号和密码忘记的完美解决方法
2018/12/06 Python
Python列表解析操作实例总结
2020/02/26 Python
Python中如何添加自定义模块
2020/06/09 Python
Python生成器generator原理及用法解析
2020/07/20 Python
THE OUTNET英国官网:国际设计师品牌折扣网站
2016/08/14 全球购物
澳大利高级泳装品牌:Bondi Born
2018/05/23 全球购物
Juice Beauty官网:有机美容产品,护肤与化妆品
2020/06/13 全球购物
芭比波朗加拿大官方网站:Bobbi Brown Cosmetics CA
2020/11/05 全球购物
介绍一下Ruby的特点
2013/01/20 面试题
西安交大自主招生自荐信
2014/01/27 职场文书
2015年大学班主任工作总结
2015/04/30 职场文书
家庭经济困难证明
2015/06/23 职场文书
详解MySQL的Seconds_Behind_Master
2021/05/18 MySQL
Nginx内网单机反向代理的实现
2021/11/07 Servers