EasyUI有控件选项卡Tabs，切换选项卡默认的是鼠标点击事件，但是这个效果也可以改成鼠标移动事件；通过鼠标移动就可以切换Tabs页。Tabs页是由多个选项卡构成的，切换不同的选项卡，展示出不同的界面。下面通过一个实例来说明选项卡由点击事件切换到鼠标移动事件，具体操作如下：
工具/原料
1
EasyUI
2
HBuilder
3
jQuery
4
浏览器
5
截图工具
6
CSS3
7
HTML5
方法/步骤
1
第一步，创建Java Web项目并在指定的文件目录下新建静态页面tabmouse.html，引入EasyUI相关的CSS和JS文件，jquery核心文件要在EasyUI的JavaScript文件前面引入，如下图所示：
3
第三步，预览该静态页面，这是会在页面看到四个Tabs页，通过点击事件切换Tabs页，如下图所示：
4
第四步，调整面板的宽度和高度，并修改其ID属性，添加script标签，如下图所示：
5
第五步，在第四步中的script标签内编写鼠标移动事件，获取面板中所有的Tabs，绑定鼠标移动事件；遍历对应的标签元素，如下图所示：
6
第六步，再次预览页面，直接利用鼠标移动操作Tabs页，这时会看到效果，如下图所示：
注意事项
1
了解鼠标点击事件和移动事件的区别
2
熟练运用EasyUI的Tabs控件
下一篇：更换散热器前的准备工作