问答详情
源自：5-8 点击菜单进入功能区的js方法

无法新建选项卡，没有脚本报错

自动换行

<!DOCTYPE html>

<html lang="zh">

<head>

<meta charset="utf-8">

<meta name="viewport"

content="width=device-width, initial-scale=1, maximum-scale=1">

<title>MP小项目</title>

<link rel="stylesheet" href="/webjars/layui/2.6.8/css/layui.css">

</head>

<body class="layui-layout-body">

<div class="layui-layout layui-layout-admin">

<div class="layui-header">

<div class="layui-logo">MP小项目</div>

<ul class="layui-nav layui-layout-right">

<li class="layui-nav-item"><a href="javascript:;">

<span>程序牛人-mp</span>

</a>

<dl class="layui-nav-child">

<dd>

<a href="">基本资料</a>

</dd>

<dd>

<a href="">安全设置</a>

</dd>

</dl></li>

<li class="layui-nav-item"><a href="/auth/logout">退了</a></li>

</ul>

</div>



<div class="layui-side layui-bg-black">

<div class="layui-side-scroll">

<!-- 左侧导航区域（可配合layui已有的垂直导航） -->

<ul class="layui-nav layui-nav-tree"  lay-filter="test">

<li class="layui-nav-item layui-nav-itemed">

<a class="" href="javascript:;">系统管理</a>

<dl class="layui-nav-child">

<dd><a href="javascript:showTab(&#39;role/toList&#39;,&#39;角色管理&#39;,11);">角色管理</a></dd>

</dl>

<dl class="layui-nav-child">

<dd><a href="javascript:showTab(&#39;account/toList&#39;,&#39;账号管理&#39;,12);">账号管理</a></dd>

</dl>

</li>

<li class="layui-nav-item layui-nav-itemed">

<a class="" href="javascript:;">客户管理</a>

<dl class="layui-nav-child">

<dd><a href="javascript:showTab(&#39;customer/toList&#39;,&#39;客户管理&#39;,21);">客户管理</a></dd>

</dl>

</li>



</ul>

</div>

</div>



<div class="layui-body">

<!-- 内容主体区域 -->

<div class="layui-tab" lay-filter="menu" lay-allowClose="true">

<ul class="layui-tab-title">

<li class="layui-this">欢迎页</li>

</ul>

<div class="layui-tab-content">

<div class="layui-tab-item layui-show">欢迎使用本系统</div>

</div>

</div>

</div>



<div class="layui-footer">

<!-- 底部固定区域 -->

© laoyuan - 底部固定区域

</div>

</div>

<script src="/webjars/layui/layui.all.js"></script>

<script src="/webjars/jquery/3.6.0/jquery.js"></script>

<script src="/js/login/main.js"></script>

</body>

</html>


function showTab(url,name,id)
{
    let length = $("li[lay-id="+id+"]").length;
    let element = layui.element;
    if (length == 0 )
    {
        let fullUrl = "/" + url;
        let height = $(window).height() - 185;
        let content = '<iframe style ="width:100%;height: '+height+'px" src = "'+fullUrl+'" frameborder="0" scrolling="no">';

        element.tabAdd('menu',
            {
                title : name,
                content : content,
                id : id
            }
        );
    }

    element.tabChange('menu',id);

}


提问者：慕田峪6080155 2021-08-23 22:49

个回答

  • 慕梦前来
    2022-07-14 20:06:36

    你这个都没有注册事件吧

    0