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 相关文章推荐
js 数组操作代码集锦
Apr 28 Javascript
JQuery下的Live方法和$.browser方法使用代码
Jun 02 Javascript
新浪微博字数统计 textarea字数统计实现代码
Aug 28 Javascript
ES6概念 ymbol.for()方法
Dec 25 Javascript
jQuery插件imgAreaSelect基础讲解
May 26 jQuery
详解vue+vuex+koa2开发环境搭建及示例开发
Jan 22 Javascript
JavaScript Math对象和调试程序的方法分析
May 13 Javascript
JS实现商城秒杀倒计时功能(动态设置秒杀时间)
Dec 12 Javascript
EXTJS7实现点击拖拉选择文本
Dec 17 Javascript
详解ES6实现类的私有变量的几种写法
Feb 10 Javascript
JS数组的常用方法整理
Mar 31 Javascript
vue使用v-model进行跨组件绑定的基本实现方法
Apr 28 Vue.js
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
php使用str_replace实现输入框回车替换br的方法
2014/11/24 PHP
PHP实现加密的几种方式介绍
2015/02/22 PHP
PHP版微信公众平台红包API
2015/04/02 PHP
Wordpress ThickBox 添加“查看原图”效果代码
2010/12/11 Javascript
javascript事件冒泡和事件捕获详解
2015/05/26 Javascript
基于jQuery实现音乐播放试听列表
2016/04/14 Javascript
JQuery.dataTables表格插件添加跳转到指定页
2017/06/09 jQuery
浅析JS中常用类型转换及运算符表达式
2017/07/23 Javascript
Angularjs实现下拉框联动的示例代码
2017/08/22 Javascript
js动态引入的四种方法
2018/05/05 Javascript
typescript nodejs 依赖注入实现方法代码详解
2019/07/21 NodeJs
浅入深出Vue之自动化路由
2019/08/06 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
微信小程序如何实现点击图片放大功能
2020/01/21 Javascript
Javascript如何实现双指控制图片功能
2020/02/25 Javascript
vue 使用饿了么UI仿写teambition的筛选功能
2021/03/01 Vue.js
Python中实现三目运算的方法
2015/06/21 Python
Python3简单实例计算同花的概率代码
2017/12/06 Python
python如何制作缩略图
2019/04/30 Python
详解numpy的argmax的具体使用
2019/05/27 Python
django项目中使用手机号登录的实例代码
2019/08/15 Python
Python基本语法之运算符功能与用法详解
2019/10/22 Python
pandas-resample按时间聚合实例
2019/12/27 Python
keras自定义回调函数查看训练的loss和accuracy方式
2020/05/23 Python
HTML5 canvas画矩形时出现边框样式不一致的解决方法
2013/10/14 HTML / CSS
爱奇艺VIP会员:大剧抢先看
2018/07/11 全球购物
工程力学专业毕业生求职信
2013/10/06 职场文书
工作疏忽检讨书
2014/01/25 职场文书
事务机电主管工作职责
2014/02/25 职场文书
开学典礼决心书
2014/03/11 职场文书
出国留学计划书
2014/04/27 职场文书
安全目标管理责任书
2014/07/25 职场文书
学雷锋活动倡议书
2014/08/30 职场文书
环境建议书
2015/02/04 职场文书
多属性、多分类MySQL模式设计
2021/04/05 MySQL
Spring boot应用启动后首次访问很慢的解决方案
2021/06/23 Java/Android