github
/
layui
mirror of https://github.com/layui/layui
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(tabs): 优化 close 方法在标签顺序打乱时传入 lay-id 的支持

pull/2690/head
贤心 2025-05-20 23:33:31 +08:00
parent ac8d5ccc30
commit e60e65e807
2 changed files with 28 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
examples/tabs.html
View File

@ -90,6 +90,26 @@
</div> </div>
</div> </div>
<h2>打乱标签顺序：</h2>
<div class="layui-tabs" lay-options="{closable: true}">
<ul class="layui-tabs-header">
<li lay-id="fff">Tab6</li>
<li lay-id="eee">Tab5</li>
<li lay-id="ccc">Tab3</li>
<li lay-id="bbb">Tab2</li>
<li lay-id="aaa">Tab1</li>
<li lay-id="ddd">Tab4</li>
</ul>
<div class="layui-tabs-body">
<div class="layui-tabs-item" lay-id="aaa">Tab Content-1</div>
<div class="layui-tabs-item" lay-id="bbb">Tab Content-2</div>
<div class="layui-tabs-item" lay-id="ccc">Tab Content-3</div>
<div class="layui-tabs-item" lay-id="ddd">Tab Content-4</div>
<div class="layui-tabs-item" lay-id="eee">Tab Content-5</div>
<div class="layui-tabs-item" lay-id="fff">Tab Content-6</div>
</div>
</div>
<h2>标签 HASH 定位</h2> <h2>标签 HASH 定位</h2>
<div class="layui-tabs layui-hide-v" id="demoTabs-hash"> <div class="layui-tabs layui-hide-v" id="demoTabs-hash">
<ul class="layui-tabs-header"> <ul class="layui-tabs-header">

16
src/modules/tabs.js
View File

@ -228,14 +228,13 @@ layui.define('component', function(exports) {
* @param {boolean} force - 是否强制删除 * @param {boolean} force - 是否强制删除
*/ */
Class.prototype.close = function(thisHeaderItem, force) { Class.prototype.close = function(thisHeaderItem, force) {
if(!thisHeaderItem || !thisHeaderItem[0]) return; if (!thisHeaderItem || !thisHeaderItem[0]) return;
var that = this; var that = this;
var options = that.config; var options = that.config;
var layid = thisHeaderItem.attr('lay-id');
var index = thisHeaderItem.index(); var index = thisHeaderItem.index();
if (!thisHeaderItem[0]) return;
// 标签是否不可关闭 // 标签是否不可关闭
if (thisHeaderItem.attr('lay-closable') === 'false') { if (thisHeaderItem.attr('lay-closable') === 'false') {
return; return;
@ -251,7 +250,7 @@ layui.define('component', function(exports) {
component.CONST.MOD_NAME, component.CONST.MOD_NAME,
'beforeClose('+ options.id +')', 'beforeClose('+ options.id +')',
$.extend(data, { $.extend(data, {
index: thisHeaderItem.index() index: index
}) })
); );
@ -271,8 +270,8 @@ layui.define('component', function(exports) {
} }
// 移除元素 // 移除元素
that.findBodyItem(layid || index).remove();
thisHeaderItem.remove(); thisHeaderItem.remove();
that.findBodyItem(index).remove();
that.roll('auto', index); that.roll('auto', index);
@ -365,7 +364,8 @@ layui.define('component', function(exports) {
var that = this; var that = this;
var options = that.config; var options = that.config;
var index = thisHeaderItem.attr('lay-id') || thisHeaderItem.index(); var layid = thisHeaderItem.attr('lay-id');
var index = thisHeaderItem.index();
var thatA = thisHeaderItem.find('a'); var thatA = thisHeaderItem.find('a');
// 是否存在跳转链接 // 是否存在跳转链接
var isLink = typeof thatA.attr('href') === 'string' && thatA.attr('target') === '_blank'; var isLink = typeof thatA.attr('href') === 'string' && thatA.attr('target') === '_blank';
@ -392,7 +392,7 @@ layui.define('component', function(exports) {
headerItem: data.thisHeaderItem headerItem: data.thisHeaderItem
}, },
to: { to: {
index: thisHeaderItem.index(), index: index,
headerItem: thisHeaderItem headerItem: thisHeaderItem
} }
}) })
@ -409,7 +409,7 @@ layui.define('component', function(exports) {
.removeClass(component.CONST.CLASS_THIS); .removeClass(component.CONST.CLASS_THIS);
// 执行标签内容切换 // 执行标签内容切换
that.findBodyItem(index).addClass(component.CONST.CLASS_SHOW) that.findBodyItem(layid || index).addClass(component.CONST.CLASS_SHOW)
.siblings().removeClass(component.CONST.CLASS_SHOW); .siblings().removeClass(component.CONST.CLASS_SHOW);
that.roll('auto', index); that.roll('auto', index);