话不多说直接上代码,该代码是本人实现完整新增并判断是否存在就切换的js代码
要注意这里本人使用jq,layui内置了jq,要使用的话,也是需要通过use该模块引进
layui.use(['jquery','element'], function(){
var element = layui.element;
var $ = layui.$;
//初始化动态元素,一些动态生成的元素如果不设置初始化,将不会有默认的动态效果
element.init();
//监听切换tab
element.on('tab(tabCard)',function(data){
// var layId=data.elem.context.attributes['lay-id'].value;
var layId=$(this).attr('lay-id');
$('#contentFrame').attr('src',layId);
});
//导航条点击监听,新增tab
element.on('nav(menuList)',function (elem) {
// console.log(elem);
var title=$(this).text();
var content=$(this).attr('lay-href');
// console.log(title);
var exist=$("li[lay-id='"+content+"']").length; //判断是否存在tab
if(exist==0){
element.tabAdd('tabCard',{
title: title,
content: content, //支持传入html
id: content,
});
}
element.tabChange('tabCard',content);//切换tab
});