layui点击某列打开并跳转指定tab

第一步添加点击事件的a标签

//showRec是需要添加的监听的名称，d是这行数据

<script>//添加列点击事件var tplCompanyName = function (d) {var html = '<a style="color:#1E9FFF" href="javascript:;" lay-event="showRec"  >'+d.cgi+'</a>';return html;}
</script>

//绑定到需要点击的列上

//在layui.use中添加监听 showTable是你自己的table的id obj是这行数据 url是你要跳转的tab的lay-id iframe中的url是跳转页面的控制层路径 'tab' 是你要跳转的tab的父页面的lay-filter

table.on('tool(showTable)', function(obj){switch(obj.event){case 'showRec':var lon = obj.data.lon;var lat = obj.data.lat;var url = '1387327539137404929';  //跳转到gis的tab页面//打开tabif(parent.getTab(url) == 0){window.parent.layui.element.tabAdd('tab', {title: 'GIS可视化',content: '<iframe lay-id="' + url + '" src="../index/gis" frameborder="0" class="admin-iframe" style="width: 1230px;height: 502px"></iframe>' //支持传入html, id: url});}else{//已经打开则先关闭再打开，这里本来想做每次跳进来都刷新页面，结果研究好几天不会整，暂时先做先关闭再打开。window.parent.layui.element.tabDelete('tab',url);window.parent.layui.element.tabAdd('tab', {title: 'GIS可视化',content: '<iframe lay-id="' + url + '" src="../index/gis" frameborder="0" class="admin-iframe" style="width: 1230px;height: 502px"></iframe>' //支持传入html, id: url});}//跳转到这个tabwindow.parent.layui.element.tabChange('tab', url);
window.parent.$("iframe[data-frameid='" + url + "']").attr("src", window.parent.$("iframe[data-frameid='" + url + "']").attr("src"))//切换后刷新框架//参数放到父页面让子页面调用parent.setLon(lon);parent.setLat(lat);}});

//父页面可以用来传递参数之类的

layui.use('element', function () {var lon = 1250000;//子页面需要的参数var lat = 430000;//子页面需要的参数var $ = layui.jquery;var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块//此方法用于判断此tab是否已经打开window.getTab=function(url){return $("li[lay-id='"+url+"']").length;}//此方法用于子页面进行传参window.getLon=function(){return this.lon;}window.setLon=function(lon){this.lon = lon;}window.getLat=function(){return this.lat;}window.setLat=function(lat){this.lat = lat;}});

、、、

大概就这样吧。

layui点击某列打开并跳转指定tab相关推荐

QQ跳转浏览器php代码,网址在手机QQ内被点击时自动打开默认浏览器跳转php源码...
通过一段代码让网址在手机QQ内被点击时自动打开默认浏览器跳转,但是这段代码并不完美,经过几个后缀不同的域名的测试,只有访问.cn或者.com域名时才能正常的跳转.这个代码适用于很多方面,例如使被QQ管 ...
layui上传文件成功后回调跳转指定页面
<script>layui.use('upload', function(){var $ = layui.jquery,upload = layui.upload;//指定允许上传的文件类 ...
android点击按钮打开一个网页,Android实现H5点击打开app或跳转指定界面
Android实现H5点击打开app或跳转指定界面本文原创,转载请注明出处.欢迎关注我的简书. 安利一波我写的开发框架:MyScFrame喜欢的话就给个Star 场景 H5界面中的入口有时候为了 ...
H5静态页面跳转微信小程序；从外部浏览器，点击H5链接跳转打开微信小程序；以及在微信内直接点击H5链接打开微信小程序；
参考链接需求:从外部浏览器,点击H5链接跳转打开微信小程序:以及在微信内直接点击H5链接打开微信小程序: 步骤1: 小程序开发需要使用云开发创建项目,使用云开发生成的项目会自带云函数文件夹: 步骤2 ...
a标签跳转后返回原页面 layui_layui页面操作，点击一个添加页面，跳转有确定，然后点击确定后将选择的几个数据返回前一个页面获取值，然后ajax请求后台...
custUserIndex.html [添加页面代码] 受试者用户邮箱完成时间批量上传开始考试生成报告查看报告编辑删除 layui.config({ base: '/layuiadmi ...
打开链接跳转浏览器代码
简介: QQ打开链接跳转浏览器代码:自动识别是否为QQ内打开,如是将自动跳转浏览器,也可复制网址自己打开,复制下方代码加入到你的页面中就可实现. 目的是为了防止QQ拦截:如有帮助到你,请记得收藏,分享 ...
微信跳转php代码,微信打开域名跳转浏览器纯PHP代码已适配安卓和IOS系统
已经做了安卓和IOS的适配.需要替换其中要跳转的网址,然后保存为php文件,在微信内访问即可实现自动跳转!<?php error_reporting(0); if($_GET['open']== ...
idea点击接口的方法的跳到实现类的快捷键
idea点击接口的方法的跳到实现类的快捷键默认快捷键是Ctrl+Alt+b 或者Ctrl+T 如果要修改的话打开: 双击修改即可!!!非常实用! 其他常用快捷键: https://blog.csd ...
点击按钮(button)打开新窗口(window)的几种情况
点击按钮(button)打开新窗口(window) 从事前端制作的朋友都有碰到过,需要点击按钮跳转到另外一个页面.只要用到简单的onclick事件就可以简单实现效果. 方式一:在原来的窗口上打开新窗口 ...

layui点击某列打开并跳转指定tab

layui点击某列打开并跳转指定tab相关推荐

最新文章

热门文章