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

如下所示：

// 弹出楼栋负责人信息页面
   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 弹出层回调获取弹出层数据的例子就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • layer实现关闭弹出层刷新父界面功能详解

    本文实例讲述了layer实现关闭弹出层刷新父界面功能.分享给大家供大家参考,具体如下: layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 最近一个项目采用的是hui前端框架,他的弹出层就是用的layer插件,对于弹出层,有一个操作体验大家都知道,就是关闭弹出层,需要刷新父页面.开始写的时候,我陷入了自己的误区,在弹出层处理成功之后,我调用的是: var index = parent.layer.getF

  • 详解Layer弹出层样式

    前言:学习layer弹出框,之前项目是用bootstrap模态框,后来改用layer弹出框,在文章的后面,我会分享项目的一些代码(我自己写的). layer至今仍作为layui的代表作,她的受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自发传播,乃至于成为今天的Layui最强劲的源动力.目前,layer已成为国内最多人使用的web弹层组件,GitHub自然Stars3000+,官网累计下载量达30w+,大概有20万Web平台正在使用layer. 具体请

  • Layer弹出层动态获取数据的方法

    前一阵子做了一个简单的小项目,用到了Layer弹出层(弹出层的用法就不多加赘述了,官网上都有详细的介绍,这里附上网址http://layer.layui.com/),当时前后台合页面的时候就出现了一个问题,弹出层总是获取不到数据,不过后面还是和同学们一起解决了,希望能帮助到大家. 之前的代码: <a id="func11" onclick="func11();">点击查看</a> function func11() { console.log

  • 获取layer.open弹出层的返回值方法

    正在开发的车联网项目用到了layer API.当我在开发"新建电子围栏"的时候需要弹出地图,用户在地图中画一个区域,最后将这个弹出层的数据返回给原页面.下面是我的实现过:程: 触发弹出层的代码: layer.open({ type: 2, title: "设置围栏", shadeClose: true, shade: 0.4, area: ['90%', '90%'], content: "/ElectronicFence/Map?id=" +

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

    如下所示: // 弹出楼栋负责人信息页面 layer.open({ type: 2, title:'请选择楼栋负责人', maxmin: false, area: ['60%', '80%'], offset: '0px', content: '${ctx}/life/houserInsertion/headBuildingInfo?pkProject='+pkProject, btn: ['确定','关闭'], yes: function(index){ //当点击'确定'按钮的时候,获取弹出

  • layer.open回调获取弹出层参数的实现方法

    如下所示: layer.open({ type : 2, title : '重命名', maxmin : true, shadeClose : true, // 点击遮罩关闭层 area : [ '200px', '150px' ], content : getContext() + "/node/torenamenode?nodeName="+nodeName, btn: ['确定'], yes: function(index, layero){ //do something/ /c

  • jQuery实现点击任意位置弹出层外关闭弹出层效果

    在之前做项目的时候经常会在主页面上点击某个按钮,右侧弹出一个div输出对应内容的详细信息.此时,我是希望在鼠标点击弹出层外的时候关闭该弹出层,主要思想就是: 找到鼠标点击的那个元素 判断这个元素是否在指定区域内,其实就是判断它的父元素是不是弹出层 如果不是就对弹出层进行hide,如果是就不进行任何操作 具体实现 该代码需要使用jQuery,代码如下: $(document).mousedown(function(e){ if($(e.target).parent("#info").le

  • Layer组件多个iframe弹出层打开与关闭及参数传递的方法

    一.Layer简介 Layer是一款近年来备受青睐的web弹层组件,基于jquery,易用.实用,兼容包括IE6在内的所有主流浏览器,拥有丰富强大的可自定义的功能. Layer官网地址:http://layer.layui.com/ 二.多个iframe弹出层(非嵌套) 1.打开iframe弹出层js代码 (1)示例一: layer.open({ type: 2, title: 'layer mobile页', shadeClose: true, shade: 0.8, area: ['380p

  • jQuery Layer弹出层传值到父页面的实现代码

    jQuery Layer弹出层传值到父页面的实现代码

    目前做的项目中用到layer弹层传值,弹层输入框输入文本,点击确定按钮,父页面的树结构,会自动添加分组. 在此粘贴下代码,以后遇到,方便回忆,如有疑问请留言,或许会为您解答 $(document).ready(function(){ //添加任务弹出层 addTask(); }); //弹出层 function addTask(){ $('[data-id="addList"]').on('click', function(){ layer.open({ type: 2,title:

  • MC Dialog js弹出层 完美兼容多浏览器(5.6更新)

    效果图:MC Dialog 功能特点 1.支持键盘操作(esc关闭,enter执行当前获得焦点按钮的事件,屏蔽了ctrl键盘,屏蔽了tab键真正实现了一个模拟浏览器自带对话框的功能) 2.支持焦点智能移动(当焦点移出层外时,自动将焦点移回层或者有按钮则移到按钮上,保证焦点始终在层上,确保快捷键操作正确) 3.智能闪烁提示功能(当焦点移出层外部,比如你在层外点击了,则层会闪烁提示你必须在当前层操作,这里完美模拟了浏览器自带对话框的操作) 4.支持按钮外接回调事件(可以自定回调事件,绑定给按钮) 5

  • 解决layer弹出层中表单不起作用的问题

    如下所示: var html = '<form class="layui-form" action="">' + '<div class="layui-form-item"><label class="layui-form-label">角色名</label><div class="layui-input-block"><input type

  • layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法

    昨天layer插件弹出层关闭问题弄的我直挠头,短短几行代码,用了我将近2个钟头才解决.我的使用场景是这样.在页面中用layer.open弹出一个层,在层内是微信支付二维码,客户扫码支付.支付成功后关闭此弹出层,并提示项目投递成功,然后再跳转到其他页面.为了监控微信二维码扫码支付是否成功.我利用了每隔三秒,查询下支付订单,查看支付订单的支付状态是否改变.在实际操作中由于使用的是location.href做跳转,然而跳转执行的非常慢,要10几秒才能成功,这不能忍.只能退而求其次,只是提示投递成功,然

  • jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)

    jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)

    弹出层用来向用户展示详细的信息,交互性非常强.弹出层有对话框.模态窗口等形式,这里我都把他们叫做弹出层,我的同事们也是这么叫的.一般我们喜欢使用比较成熟的弹出层插件如fancybox等,但在本文,我将先抛弃插件,给大家介绍如何使用jQuery+CSS3+Html5实现弹出层. 效果展示       源码下载 我们完全使用HTML5+CSS3+jQuery来实现一个基本的弹出层效果,因此我们可以在示例中任意修改弹出层外观样式.甚至js方法调用.我们最终做出来的弹出层效果应该是响应式的,也就是说可以

随机推荐