目的:主页面选中表格行数,iframe 的 input框打开时就有选中的表格行数值

(卡数量为1,表示 主页面只勾选了一行)

过程:

主页面代码:

HTML:

// 构造一个按钮触发事件
<button class="layui-btn layuiadmin-btn-list" data-type="bi" style="float:right">批量发卡
</button>

JS:


// bi 是按钮的 data-type="bi"  layui另一种形式的事件过滤器
bi: function () {var checkStatus = table.checkStatus('user_info')//把表格选中的行数赋值给子页面,并在input框中显示, checkData = checkStatus.data.length; //得到选中的数据if (checkData.length === 0) {return layer.msg('请选择数据');}layer.open({type: 2, title: '发卡', content: 'batch-iframe.html', maxmin: true, area: ['550px', '550px']  // 页面大小, btn: ['确定', '取消'], success: function (layero, index) {// 向iframe层传值,将值直接复制到iframe层的input框中                              layero.find('iframe').contents().find("#card_num").val(checkData);}, yes: function (index, layero) {var iframe = window['layui-layer-iframe' + index]; // 找到iframe层//点击确认触发 iframe 内容中的按钮提交var submit = layero.find('iframe').contents().find("#layuiadmin-app-form-submit");submit.click();}});table.reload('user_info');},

iframe层代码:

HTML:

 <input type="text" name="card_num" id="card_num" lay-verify="required" autocomplete="off" class="layui-input">

注:iframe 层html 用于让主页面传值定位(意思是:让主页面的值在哪里显示)

Layui(三) iframe层(弹窗)input就有主窗体的传值相关推荐

  1. layui弹出层之layer.open弹出iframe窗口·

    layui弹出层之layer.open弹出iframe窗口· layer.open弹出iframe窗口 [1]该功能为案例,弹出iframe窗口显示上传数据 由于layui的弹出层每次执行layer. ...

  2. layui按钮---Layer自定义按钮,关闭弹出层/弹窗;layer自带按钮

    本天在写代码过程中遇到一个问题. layer本身自带弹窗按钮,可自定义内容及方法,如下: function openCurtain(){top.layer.open({type : 2,area : ...

  3. Layui弹出层的三项选择

    以Layu.msg()为例. layer.msg('大部分参数都是可以公用的<br>合理搭配,展示不一样的风格', {time: 20000, //20s后自动关闭btn: ['明白了', ...

  4. layer弹窗的iframe层怎么关闭。为什么设置的layer.iframeAuto(index)高度不能自适应

    //在iframe页 var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引.每个弹窗层都会分配一个索引.第一次点 ...

  5. js layui跳转页面_Layer.js提示层弹窗结束之后自动跳转到新页面的效果

    弹层之美 Layer 是一款近年来备受青睐的web弹层组件,提供layer.open(options)核心调用方法.她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的 ...

  6. Layui 弹出层插件

    Layui 弹出层插件 开发工具与关键技术: Visual Studio 2015 – Layui 作者:廖亚星 撰写时间:2019年 6 月4日 这段时间在做项目页面的搭建,在页面的操作中,会出现很 ...

  7. layui弹出框php,layui弹出层怎么使用

    layui弹出层的使用方法:首先引入jQuery1.8以上的任意版本:然后引入laery.js:最后通过"function show(){var a = layer.open({...}); ...

  8. layui弹出层在登录中的应用

    layui弹出层在登录中的应用 首先写好登录界面,然后在主界面登录按钮上添加layui弹出层. 登录界面.注册界面二合一(含表单验证) <!DOCTYPE html> <html l ...

  9. Layui弹出层关闭

    Layui弹窗关闭 直接 var index=layer.open({...success:function(){layer.close(index);} }) //获取当前窗口的namevar in ...

最新文章

  1. kml 解析 java_KML文件解析显示在地图
  2. win7编程接口的一些变化
  3. css中小型大写,css3 – OpenType小型大写的CSS回退
  4. 小小聊天室,慢慢的回忆啊!(TCP 通信实现)
  5. 数字信号处理学习笔记(四)|实现巴特沃斯型模拟低通滤波器
  6. python程序会监控错误的语句_python装饰器实现对异常代码出现进行自动监控
  7. object string java_Object类和String类
  8. python的三个基本数字类型_Python基础学习--三 基本数据类型
  9. GF6 WFV卫星视角影响、与Sentinel2协同及精度分析
  10. mac mtu测试_如何查看 Mac 的以太网卡速度
  11. 知乎网站2010年12月开放,三个月后获得了李开复的天使投资
  12. 前端系列第10集-实战篇
  13. NuttX的学习笔记 9
  14. vb/vb.net开发精粹(19)
  15. 千里眼-智行千里,眼见为实 源码分享
  16. vue前端自动生成编号或者订单单号(日期+随机数)
  17. python朋友圈点赞_python(html 点赞+1)
  18. ins的更新带来的一系列问题
  19. c语言lnk1120,c - 致命错误LNK1120:C中1个未解决的外部问题 - 堆栈内存溢出
  20. SQL优化 —— in与not in

热门文章

  1. vue eacharts折线图 实线加虚线 实线区域渐变色 添加虚线
  2. 如何查看Chrome浏览器的页面缓存内容【详细教程】
  3. MinIO多用户权限管理
  4. Dynamics CRM技术开发应该知道的十件事(上)
  5. Nordic 从官网下载产品规格书和离线文档
  6. 【Java 环境搭建】(二)Maven
  7. pythonxy安装包_Python软件包:Python(x,y)
  8. ollydbg调试总结(一)
  9. ucore lab1学习笔记整理
  10. Vmware 8导致apache2无法启动的情况