<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>多选项卡内容</title> <link rel="stylesheet" href="../../component/pear/css/pear.css" /> </head> <body class="pear-container"> <div class="layui-card"> <div class="layui-card-header"></div> <div class="layui-card-body"> <button class="pear-btn pear-btn-primary add">新增 Demo</button> <button class="pear-btn pear-btn del">关闭 当前</button> </div> </div> </body> <script src="../../component/layui/layui.js"></script> <script src="../../component/pear/pear.js"></script> <script> layui.use(['tab','jquery','layer'],function(){ var $ = layui.jquery, layer = layui.layer, tab = layui.tab; $(".add").click(function(){ // ADD 添加方法 parent.layui.tab.addTabOnlyByElem('contents',{id:'demo',title:'Demo',url:'../system/space.html',close: true}) }) $(".del").click(function(){ parent.layui.tab.delCurrentTabByElem('contents',function(id){ layer.msg("已删除 '"+id+"' 标签页") }); }) }) </script> </html>