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 相关文章推荐
ejs v9 javascript模板系统
Mar 21 Javascript
jQuery旋转插件—rotate支持(ie/Firefox/SafariOpera/Chrome)
Jan 16 Javascript
动态加载JS文件的三种方法
Nov 08 Javascript
8个实用的jQuery技巧
Mar 04 Javascript
javascript实现控制浏览器全屏
Mar 30 Javascript
使用jQuery操作HTML的table表格的实例解析
Mar 13 Javascript
jQuery中使用animate自定义动画的方法
May 29 Javascript
早该知道的7个JavaScript技巧
Jun 21 Javascript
实例讲解javascript实现异步图片上传方法
Dec 05 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
Dec 13 Javascript
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
vue实现手机号码的校验实例代码(防抖函数的应用场景)
Sep 05 Javascript
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
Linux下实现PHP多进程的方法分享
2012/08/16 PHP
PHP实现动态删除XML数据的方法示例
2018/03/30 PHP
laravel 配置路由 api和web定义的路由的区别详解
2019/09/03 PHP
PHP7 整型处理机制修改
2021/03/09 PHP
将CKfinder整合进CKEditor3.0的新方法
2010/01/10 Javascript
javascript 鼠标拖动图标技术
2010/02/07 Javascript
妙用Jquery的val()方法
2012/06/27 Javascript
使用js修改客户端注册表的方法
2013/08/09 Javascript
extjs表格文本启用选择复制功能具体实现
2013/10/11 Javascript
捕获和分析JavaScript Error的方法
2014/03/25 Javascript
ie下js不执行的几种可能
2017/02/28 Javascript
jQuery 表单序列化实例代码
2017/06/11 jQuery
Vue使用Canvas绘制图片、矩形、线条、文字,下载图片
2019/04/26 Javascript
JavaScript从原型到原型链深入理解
2019/06/03 Javascript
[02:36]DOTA2亚洲邀请赛小组赛精彩集锦:奇迹哥卡尔秀翻全场
2017/03/28 DOTA
Python中关于字符串对象的一些基础知识
2015/04/08 Python
windows下pycharm安装、创建文件、配置默认模板
2018/07/31 Python
set在python里的含义和用法
2019/06/24 Python
在django-xadmin中APScheduler的启动初始化实例
2019/11/15 Python
使用 pytorch 创建神经网络拟合sin函数的实现
2020/02/24 Python
如何基于Python代码实现高精度免费OCR工具
2020/06/18 Python
英国和爱尔兰最大的地毯零售商:Kukoon
2018/12/17 全球购物
体育纪念品、亲笔签名的体育收藏品:Steiner Sports
2020/07/31 全球购物
三个Unix的命令面试题
2015/04/12 面试题
眼镜促销方案
2014/03/15 职场文书
纪检监察建议书
2014/05/19 职场文书
人事专员岗位职责说明书
2014/07/30 职场文书
停电调休通知
2015/04/16 职场文书
离婚案件上诉状
2015/05/23 职场文书
小学三年级数学教学反思
2016/02/16 职场文书
Python3 使用pip安装git并获取Yahoo金融数据的操作
2021/04/08 Python
React如何创建组件
2021/06/27 Javascript
Python利用机器学习算法实现垃圾邮件的识别
2021/06/28 Python
Go中的条件语句Switch示例详解
2021/08/23 Golang
工厂无线对讲系统解决方案
2022/02/18 无线电
python疲劳驾驶困倦低头检测功能的实现
2022/04/04 Python