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 相关文章推荐
超级强大的表单验证
Jun 26 Javascript
JavaScript 用cloneNode方法克隆节点的代码
Oct 15 Javascript
使用简洁的jQuery方法实现隔行换色功能
Jan 02 Javascript
ECMAScript6新增值比较函数Object.is
Jun 12 Javascript
JSON 数据详解及实例代码分析
Jan 20 Javascript
JavaScript 函数节流详解及方法总结
Feb 09 Javascript
js读取json文件片段中的数据实例
Mar 09 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
深入理解Vuex 模块化(module)
Sep 26 Javascript
使用JSON格式提交数据到服务端的实例代码
Apr 01 Javascript
Vue CLI 3搭建vue+vuex最全分析(推荐)
Sep 27 Javascript
jquery html添加元素/删除元素操作实例详解
May 20 jQuery
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
php性能优化分析工具XDebug 大型网站调试工具
2011/05/22 PHP
thinkPHP5 tablib标签库自定义方法详解
2017/05/10 PHP
两种简单实现菜单高亮显示的JS类代码
2010/06/27 Javascript
原生javaScript做得动态表格(注释写的很清楚)
2013/12/29 Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
2015/09/04 Javascript
jQuery1.9.1源码分析系列(十六)ajax之ajax框架
2015/12/04 Javascript
JavaScript代码因逗号不规范导致IE不兼容的问题
2016/02/25 Javascript
JavaScript队列、优先队列与循环队列
2016/11/14 Javascript
简单几步实现返回顶部效果
2016/12/05 Javascript
JS+Ajax实现百度智能搜索框
2017/08/04 Javascript
详解React中合并单元格的正确写法
2019/01/08 Javascript
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
vue-cli单页面预渲染seo-prerender-spa-plugin操作
2020/08/10 Javascript
vue实现简易的双向数据绑定
2020/12/29 Vue.js
Python使用functools模块中的partial函数生成偏函数
2016/07/02 Python
Python利用Beautiful Soup模块修改内容方法示例
2017/03/27 Python
python对DICOM图像的读取方法详解
2017/07/17 Python
python中的变量如何开辟内存
2018/06/26 Python
Python使用enumerate获取迭代元素下标
2020/02/03 Python
Python小白不正确的使用类变量实例
2020/05/29 Python
pycharm 关掉syntax检查操作
2020/06/09 Python
定义css设备类型-Media Queries图表简介及使用方法
2013/01/21 HTML / CSS
英国虚拟主机服务商:eUKhost
2016/08/16 全球购物
世界上最好的威士忌和烈性酒购买网站:The Whisky Exchange
2016/11/20 全球购物
英国性感内衣和睡衣品牌:Bluebella
2018/01/26 全球购物
Expedia印度尼西亚站:预订酒店、廉价航班和度假套餐
2018/01/31 全球购物
个人安全生产责任书
2014/07/28 职场文书
对外汉语专业大学生职业生涯规划范文
2014/09/13 职场文书
乡镇群众路线整改落实情况汇报
2014/10/28 职场文书
2015年七年级班主任工作总结
2015/05/21 职场文书
钢琴师观后感
2015/06/12 职场文书
行为规范主题班会
2015/08/13 职场文书
详解Apache SkyWalking 告警配置指南
2021/04/22 Servers
MySQL索引知识的一些小妙招总结
2021/05/10 MySQL
浅析JavaScript中的变量提升
2022/06/01 Javascript