layui弹出框Tab选项卡的示例代码


Posted in Javascript onSeptember 04, 2019

最近做一个项目,使用LAYUI,在界面上Z弹出一个界面A,A上有TAB选项卡,分别为界面B、C;B界面上有一个列表,双击败列表行时,要把数据回写到界面Z; 界面A上有提交按钮,选中B界面上列表某一条数据,界面A上点提交时,同样回写数据到Z;

实现:双击:B上实现双击方法,调用A上界面方法,再调用Z界面上方法;

B界面上方法:

function dbclick_select(row,index){
debugger;
  if(row == null){
    var nodes=$("#TableSelectList").bootstrapTable('getSelections');
    row = nodes[0];
    if(row == undefined){
      row = null;
    }
  }
  if(row != null && row != ""){
    window.parent.onBackDwxx(row);
      
  }else{
    layer.alert("请选择一项数据");
  }

}

A界面上方法:

function onBackDwxx(row) {
  debugger;
  window.parent.onBackDwxx(row);
   var iframeName = window.name;
    var index = parent.layer.getFrameIndex(iframeName);
   window.parent.layer.close(index);

  }

Z界面上方法:

function onBackDwxx(row) {
   $("#query\\.dw_id").val(row.id);
   $("#dw_mc").val(row.zsdwmc);

  }

A界面上提交按钮实现:Z界面上提交方法调用A界面上方法,A界面上方法回调Z界面方法

Z界面方法调用A界面方法:$(layero).find("iframe")[0].contentWindow.onSelectTableDwxx();

A界面方法:

function onBackDwxx(row) {
  debugger;
  window.parent.onBackDwxx(row);
   var iframeName = window.name;
    var index = parent.layer.getFrameIndex(iframeName);
   window.parent.layer.close(index);
  }
  
  function onSelectTableDwxx(){
  var winx = $("#iframe1").find("iframe")[0].contentWindow;
  var nodes = winx.$("#TableSelectList").bootstrapTable('getSelections');
  onBackDwxx(nodes[0]);

}

Z界面上方法:

function onBackDwxx(row) {
   $("#query\\.dw_id").val(row.id);
   $("#dw_mc").val(row.zsdwmc);

  }

以上这篇layui弹出框Tab选项卡的示例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
我也种棵OO树JXTree[js+css+xml]
Apr 02 Javascript
一个用js实现的页内搜索代码
May 23 Javascript
COM中获取JavaScript数组大小的代码
Nov 22 Javascript
jquery 插件学习(二)
Aug 06 Javascript
JavaScript实现表格点击排序的方法
May 11 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
Jul 05 Javascript
js 判断一组日期是否是连续的简单实例
Jul 11 Javascript
JavaScript中匿名函数的递归调用
Jan 22 Javascript
jQuery插件HighCharts绘制2D饼图效果示例【附demo源码下载】
Mar 21 jQuery
JavaScript命名空间模式实例详解
Jun 20 Javascript
基于vue-cli3+typescript的tsx开发模板搭建过程分享
Feb 28 Javascript
Element Card 卡片的具体使用
Jul 26 Javascript
在layui tab控件中载入外部html页面的方法
Sep 04 #Javascript
微信自定义分享链接信息(标题,图片和内容)实现过程详解
Sep 04 #Javascript
微信小程序按钮点击动画效果的实现
Sep 04 #Javascript
微信小程序实现点击卡片 翻转效果
Sep 04 #Javascript
layui实现tab的添加拒绝重复的方法
Sep 04 #Javascript
Layui 导航默认展开和菜单栏选中高亮设置的方法
Sep 04 #Javascript
微信小程序官方动态自定义底部tabBar的例子
Sep 04 #Javascript
You might like
一个PHP操作Access类(PHP+ODBC+Access)
2007/01/02 PHP
PHP 远程关机实现代码
2009/11/10 PHP
PHP 中关于ord($str)>0x80的详细说明
2012/09/23 PHP
PHP类相关知识点实例总结
2016/09/28 PHP
php创建图像具体步骤
2017/03/13 PHP
PHP针对伪静态的注入总结【附asp与Python相关代码】
2017/08/01 PHP
鼠标移动到一张图片时变为另一张图片
2006/12/05 Javascript
javascript options属性集合操作代码
2009/12/28 Javascript
window.addEventListener来解决让一个js事件执行多个函数
2012/12/26 Javascript
jQuery getJSON()+.ashx 实现分页(改进版)
2013/03/28 Javascript
JS动态获取当前时间,并写到特定的区域
2013/05/03 Javascript
jquery click([data],fn)使用方法实例介绍
2013/07/08 Javascript
分享Javascript中最常用的55个经典小技巧
2013/11/29 Javascript
jquery操作checkbox示例分享
2014/07/21 Javascript
JS倒计时代码汇总
2014/11/25 Javascript
jQuery创建自定义的选择器用以选择高度大于100的超链接实例
2015/03/18 Javascript
JavaScript中join()方法的使用简介
2015/06/09 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
[02:19]DOTA选手解说齐贺岁
2018/02/11 DOTA
[01:27:43]VGJ.S vs TNC Supermajor 败者组 BO3 第三场 6.6
2018/06/07 DOTA
python抓取网页中图片并保存到本地
2015/12/01 Python
基于pytorch 预训练的词向量用法详解
2020/01/06 Python
Python日期格式和字符串格式相互转换的方法
2020/02/18 Python
Django用数据库表反向生成models类知识点详解
2020/03/25 Python
python删除文件、清空目录的实现方法
2020/09/23 Python
Python操作word文档插入图片和表格的实例演示
2020/10/25 Python
Python常用扩展插件使用教程解析
2020/11/02 Python
python入门教程之基本算术运算符
2020/11/13 Python
Python监听键盘和鼠标事件的示例代码
2020/11/18 Python
新加坡航空官方网站:Singapore Airlines
2016/10/13 全球购物
Too Faced官网:美国知名彩妆品牌
2017/03/07 全球购物
理发店策划方案
2014/06/05 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
2014年全国法制宣传日宣传活动方案
2014/11/02 职场文书
回门宴新娘答谢词
2015/09/29 职场文书
JavaScript实现简单的音乐播放器
2022/08/14 Javascript