php左侧导航右侧tab标签,layui左侧菜单和右侧的tab关联

2018-01-04

开始使用layui

layui 后台布局

• 控制台
• 商品管理
• 用户

• 其它系统

  邮件管理

  消息管理

  授权管理

• 

  贤心

  基本资料

  安全设置

• 退了

• 所有商品

  文章列表

  发送信息

  权限分配

  超链接

• 解决方案

  列表一

  列表二

  超链接

• 云市场
• 发布商品

• 

  控制面板

© layui.com - 底部固定区域

//JavaScript代码区域

var $ = layui.jquery,

element = layui.element;

$(document).on('click', 'a', function () {

if (!$(this)[0].hasAttribute("tab_id") || $(this).attr("tab_id") === '') {

return;

}

var layid = $(this).attr("tab_id");

var text = $(this).text();

var dataurl = $(this).attr("data-url");

alert(layid);

var tabs = $(".layui-tab-title").children();

var msg = true;

$.each(tabs, function (i, item) {

var tabid = $(item).attr("lay-id");

alert('遍历' + tabid);

if (tabid === layid) {

alert('相等了');

msg = false;

return false;

}

});

alert('msg' + msg);

if (msg) {

element.tabAdd('mytab', {

title: text,

content: "",

id: layid

});

}

resize();

element.tabChange('mytab', layid);

});

function resize() {

var $content = $(".layui-tab-content");

$content.height($(this).height() - 200);

$content.find('iframe').each(function () {

$(this).height($content.height());

$(this).width("100%")

})

}

$(window).on('resize', function () {

var $content = $(".layui-tab-content");

$content.height($(this).height() - 200);

$content.find('iframe').each(function () {

$(this).height($content.height());

$(this).width("100%")

});

});

$(window).on('load', function () {

var $content = $(".layui-tab-content");

$content.height($(this).height() - 200);

$content.find('iframe').each(function () {

$(this).height($content.height());

$(this).width("100%")

});

})

/* element.on('nav(test)', function(elem){

console.log(JSON.stringify(elem)); //得到当前点击的DOM对象

var layid=location.hash.replace(/^#tab=/,'');

alert(layid);

element.tabChange('mytab',layid);

});*/