使用layui实现的水平导航动态操作tab项以及优化鼠标右键功能

基于之前几篇博客优化layui的tab鼠标右键功能（参考博客https://blog.csdn.net/nb7474/article/details/79413460/），使用layui实现的水平导航动态操作tab项，本篇博客主要讲的是：新增基于鼠标焦点（mouseover事件）的鼠标右键功能（包括刷新，关闭其他，关闭右边所有，关闭所有）

该篇文章主要优化tab的鼠标右键事件，之前看了几篇类似文章有鼠标右键事件，但是鼠标右键记录的id都是新增Tab的id，所以右键关闭都是定死的，只能关闭新增的tab，不能实现当我鼠标指向一个tab右键关闭时关闭当前指向的tab。

参考图片的右键事件（基于鼠标焦点（mouseover事件）的鼠标右键功能）

具体动态操作layui的tab（包括动态新增，删除Tab）如果下面文字看不懂的话请参考上述的博客，写的非常清楚了

引入layui.js和layui.css 

<!--改成本地的文件就可以了-->
<link rel="stylesheet" href="client/homePage/layui/css/layui.css"  media="all">
<script src="client/homePage/layui/layui.js" charset="utf-8"></script>	

下面是水平导航（layui的Tab和Tab界面）的html代码，包括了鼠标右键功能的代码

<!-- 以下是菜单栏 -->
	<ul class="layui-nav">
	  <li class="layui-nav-item"><a data-url="11" data-id="11" data-title="选项a"  class="site-demo-active"  href="javascript:void(0);">测试1Tab</a>