easyui tabs选项卡,事件触发关闭某一个tab

最新推荐文章于 2021-01-28 09:25:22 发布

baiduren！

最新推荐文章于 2021-01-28 09:25:22 发布

阅读量2.6k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_42454941/article/details/88837109

本文介绍了一个使用 EasyUI 框架实现的 tabs 选项卡组件示例，展示了如何创建多个可关闭的选项卡，并通过 JavaScript 实现了点击按钮关闭特定选项卡的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!--tabs选项卡 -->
<div id="tt" class="easyui-tabs" style="width:500px;height:250px;">
    <div title="Tab1" style="padding:20px;display:none;">
		tab1
    </div>
    <div title="Tab2" data-options="closable:true" style="overflow:auto;padding:20px;display:none;">
		tab2
    </div>
    <div title="Tab3" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;display:none;">
		tab3
    </div>
</div>
<!--点击按钮关闭tab3 -->
<input type='button' name='close' value='关闭tab3' id='closeTab3'>

js:

document.getElementById('clsoeTab3').addEventListener('click',function(){
    var isExistence =$('#tt').tabs('exists','tab3');
    if(isExistence){
        $('#tt').tabs('close','Tab3');
    }
})