layui学习使用问题整理 —— Tabs选项卡

1. 去掉tab标签页中第一项的删除 x 按钮

   

 body .layui-tab-title li:nth-child(1) i {
     display: none;
 } 

2. tab标签页动态添加

通过+实现动态添加tab标签页。  

jsp代码：

 js代码：

//触发事件
var active = {
//在这里给active绑定几项事件，后面可通过active调用这些事件
    tabAdd: function(url,id,name) {//新增一个Tab项 传入三个参数，分别对应其标题，tab页面的地址，还有一个规定的id，是标签中data-id的属性值
	element.tabAdd('tabid', {
		title: name,
	        content: '<iframe id="tabFrame'+id+'" scrolling="no" frameborder="0" src="'+url +'" style="width:100%;height: 154px;"></iframe>',
	        id: id //规定好的id
	});
        element.render('tab');//重新渲染tab
    },
    tabChange: function(id) {
	//切换到指定Tab项
	element.tabChange('runWayTad', id); //根据传入的id传入到指定的tab项
    },
    tabDelete: function (id) {
	 element.tabDelete("runWayTad", id);//删除
    }
};