easyui之菜单导航切换Tab

使用EasyUI实现菜单导航与Tab切换

起床困难hu

于 2016-11-24 15:47:28 发布

阅读量6.9k

点赞数

CC 4.0 BY-SA版权

文章标签：菜单导航选项卡切换

本文链接：https://blog.csdn.net/miaoca/article/details/53321302

这篇博客介绍了如何使用EasyUI库在HTML页面中创建布局，包括north、south、west、east和center区域，并实现菜单导航与Tab选项卡切换的功能。在菜单点击事件中，当选择某个菜单项时，Tab会关闭已存在的对应页面并刷新内容。同时，博客还展示了菜单数据的定义和加载，以及皮肤选择功能。

1, 主页HTML
引包
<link rel="stylesheet" type="text/css" href="../js_lib/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../js_lib/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="../res/css/mlh.css">

<script type="text/javascript" src="../js_lib/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../js_lib/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js_lib/easyui/easyui-lang-zh_CN.js"></script>

<script type="text/javascript" src="../js/admin.js"></script>

DIV设置north（上，标题）south（下）west（左，菜单）east（右）center（居中，主工作区，Tab选项卡）
<div id="cc" class="easyui-layout">
<div id="c_north" data-options="region:'north'">
<div id="c_west" data-options="region:'wes