layui 弹出层回调获取弹出层数据的例子


Posted in Javascript onSeptember 02, 2019

如下所示:

// 弹出楼栋负责人信息页面
   layer.open({
   type: 2,
   title:'请选择楼栋负责人',
   maxmin: false,
   area: ['60%', '80%'],
   offset: '0px',
   content: '${ctx}/life/houserInsertion/headBuildingInfo?pkProject='+pkProject,
   btn: ['确定','关闭'],
    yes: function(index){
    //当点击‘确定'按钮的时候,获取弹出层返回的值
    var res = window["layui-layer-iframe" + index].callbackdata();
    //打印返回的值,看是否有我们想返回的值。
    console.log(res);
    for (var i = 0; i < res.length; i++) {
    var html = "<div class='text' value='' style='visibility: visible;'>" +
     "<p>" + "<span class='responsibleName' value=" + res[i].value + ">" + res[i].title + "</span>" +
     "<a class='close_btn' οnclick='remove(this)'>" + 'X' + "</a>" + "</p>"
    "</div>"
    $("#responsibleName_id").append(html);
    
    }
    //最后关闭弹出层
    layer.close(index);
   }
   });

// 关键代码var res = window["layui-layer-iframe" + index].callbackdata();

这行代码中‘callbackdata'是弹出层里面定义的函数。也许我们知道了什么!这个函数的作用就是返回值。
弹出层定义callbackdata函数

var callbackdata = function () {
  var data = {
  username: 'zhangfj',
  age:12,
  address:'广州'
  };
  return data;
 }

注意:下图是弹出层回调数据

layui 弹出层回调获取弹出层数据的例子

以上这篇layui 弹出层回调获取弹出层数据的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网页前台通过js非法字符过滤代码(骂人的话等等)
May 26 Javascript
jquery中ajax使用error调试错误的方法
Feb 08 Javascript
详解AngularJS中的http拦截
Feb 09 Javascript
DIV随滚动条滚动而滚动的实现代码【推荐】
Apr 12 Javascript
详解JavaScript中基于原型prototype的继承特性
May 05 Javascript
用js动态添加html元素,以及属性的简单实例
Jul 19 Javascript
JavaScript中闭包的详解
Apr 01 Javascript
详解vue.js2.0父组件点击触发子组件方法
May 10 Javascript
基于bootstrap写的一点localStorage本地储存
Nov 21 Javascript
H5+C3+JS实现五子棋游戏(AI篇)
May 28 Javascript
vue获取data数据改变前后的值方法
Nov 07 Javascript
vue 页面跳转的实现方式
Jan 12 Vue.js
vue中通过使用$attrs实现组件之间的数据传递功能
Sep 01 #Javascript
Vue使用mixin分发组件的可复用功能
Sep 01 #Javascript
JavaScript页面加载事件实例讲解
Sep 01 #Javascript
Node.js安装详细步骤教程(Windows版)详解
Sep 01 #Javascript
vue组件命名和props命名代码详解
Sep 01 #Javascript
Vue-CLI项目中路由传参的方式详解
Sep 01 #Javascript
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
Sep 01 #Javascript
You might like
PHP利用MySQL保存session的实现思路及示例代码
2014/09/09 PHP
利用php-cli和任务计划实现订单同步功能的方法
2017/05/03 PHP
jQuery帮助之筛选查找 children([expr])
2011/01/31 Javascript
用JS控制回车事件的代码
2011/02/20 Javascript
原生js拖拽(第一课 未兼容)拖拽思路
2013/03/29 Javascript
jquery自定义类似$.ajax()的方法实现代码
2013/08/13 Javascript
遍历DOM对象内的元素属性示例代码
2014/02/08 Javascript
jquery选择checked在ie8普通模式下的问题
2014/02/12 Javascript
在js中实现邮箱格式的验证方法(推荐)
2016/10/24 Javascript
Ajax与服务器(JSON)通信实例代码
2016/11/05 Javascript
Vue.js实现列表清单的操作方法
2017/11/15 Javascript
使用node.js实现微信小程序实时聊天功能
2018/08/13 Javascript
Javascript 实现 Excel 导入生成图表功能
2018/10/22 Javascript
原生JS实现顶部导航栏显示按钮+搜索框功能
2019/12/25 Javascript
[55:48]VGJ.S vs TNC Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
python中wx将图标显示在右下角的脚本代码
2013/03/08 Python
Python浅拷贝与深拷贝用法实例
2015/05/09 Python
python散点图实例之随机漫步
2018/08/27 Python
python执行精确的小数计算方法
2019/01/21 Python
Python 时间戳之获取整点凌晨时间戳的操作方法
2020/01/28 Python
Python continue语句实例用法
2020/02/06 Python
python函数超时自动退出的实操方法
2020/12/28 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
捷克浴室和厨房设备购物网站:SIKO
2018/08/11 全球购物
台湾演唱会订票网站:StubHub台湾
2019/06/11 全球购物
Bandier官网:奢侈、时尚前卫的健身服装首选目的地
2020/07/05 全球购物
高中自我鉴定范文
2013/11/03 职场文书
房地产管理毕业生自荐信
2013/11/04 职场文书
企业员工培训感言
2014/02/26 职场文书
门面房租房协议书
2014/08/20 职场文书
学校领导班子群众路线整改措施
2014/09/16 职场文书
音乐课外活动总结
2015/05/09 职场文书
搞笑的婚礼主持词
2015/06/29 职场文书
七年级思品教学反思
2016/02/20 职场文书
详解Redis基本命令与使用场景
2021/06/01 Redis
python自动化测试通过日志3分钟定位bug
2021/11/20 Python