mirror of https://github.com/layui/layui
Merge remote-tracking branch 'origin/2.x' into 2.x
commit
1c59d46699
|
@ -32,7 +32,7 @@ body{padding:20px;}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button class="layui-btn" onclick="layui.element.tabChange('tabDemo', 3)">手工切换到“标题3”</button>
|
<button class="layui-btn" onclick="layui.element.tabChange('tabDemo', 3)">手工切换到“标题3”</button>
|
||||||
<button class="layui-btn" onclick="layui.element.tabAdd('tabDemo', {title:'新标题', content:'新内容', id: +new Date})">添加Tab</button>
|
<button class="layui-btn" onclick="layui.element.tabAdd('tabDemo', {title:'新标题', content:'新内容', id: +new Date, change: true})">添加Tab</button>
|
||||||
<button class="layui-btn" onclick="layui.element.tabDelete('tabDemo', 4)">删除“标题4”</button>
|
<button class="layui-btn" onclick="layui.element.tabDelete('tabDemo', 4)">删除“标题4”</button>
|
||||||
|
|
||||||
<div class="layui-tab layui-tab-brief">
|
<div class="layui-tab layui-tab-brief">
|
||||||
|
@ -78,7 +78,8 @@ body{padding:20px;}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ul class="layui-tab-title">
|
<div class="layui-tab">
|
||||||
|
<ul class="layui-tab-title">
|
||||||
<li class="layui-this"><a href="#1">标题题题题题题1</a></li>
|
<li class="layui-this"><a href="#1">标题题题题题题1</a></li>
|
||||||
<li><a href="#2">标题题题2</a></li>
|
<li><a href="#2">标题题题2</a></li>
|
||||||
<li><a href="#3">标题3</a></li>
|
<li><a href="#3">标题3</a></li>
|
||||||
|
@ -87,7 +88,8 @@ body{padding:20px;}
|
||||||
<li><a href="#6">标题6</a></li>
|
<li><a href="#6">标题6</a></li>
|
||||||
<li><a href="#7">标题7</a></li>
|
<li><a href="#7">标题7</a></li>
|
||||||
<li><a href="#8">标题题题题题题题8</a></li>
|
<li><a href="#8">标题题题题题题题8</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="layui-tab" lay-filter="test" lay-allowClose="true">
|
<div class="layui-tab" lay-filter="test" lay-allowClose="true">
|
||||||
<ul class="layui-tab-title">
|
<ul class="layui-tab-title">
|
||||||
|
|
|
@ -49,8 +49,10 @@ layui.define('jquery', function(exports){
|
||||||
|
|
||||||
barElem[0] ? barElem.before(li) : titElem.append(li);
|
barElem[0] ? barElem.before(li) : titElem.append(li);
|
||||||
contElem.append('<div class="layui-tab-item">'+ (options.content || '') +'</div>');
|
contElem.append('<div class="layui-tab-item">'+ (options.content || '') +'</div>');
|
||||||
call.hideTabMore(true);
|
// call.hideTabMore(true);
|
||||||
call.tabAuto();
|
// 是否添加即切换
|
||||||
|
options.change && this.tabChange(filter, options.id);
|
||||||
|
call.tabAuto(options.change);
|
||||||
return this;
|
return this;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -180,19 +182,22 @@ layui.define('jquery', function(exports){
|
||||||
}
|
}
|
||||||
|
|
||||||
// Tab 自适应
|
// Tab 自适应
|
||||||
,tabAuto: function(){
|
,tabAuto: function(spread){
|
||||||
var SCROLL = 'layui-tab-scroll', MORE = 'layui-tab-more', BAR = 'layui-tab-bar'
|
var SCROLL = 'layui-tab-scroll';
|
||||||
,CLOSE = 'layui-tab-close', that = this;
|
var MORE = 'layui-tab-more';
|
||||||
|
var BAR = 'layui-tab-bar';
|
||||||
|
var CLOSE = 'layui-tab-close';
|
||||||
|
var that = this;
|
||||||
|
|
||||||
$('.layui-tab').each(function(){
|
$('.layui-tab').each(function(){
|
||||||
var othis = $(this)
|
var othis = $(this);
|
||||||
,title = othis.children('.layui-tab-title')
|
var title = othis.children('.layui-tab-title');
|
||||||
,item = othis.children('.layui-tab-content').children('.layui-tab-item')
|
var item = othis.children('.layui-tab-content').children('.layui-tab-item');
|
||||||
,STOPE = 'lay-stope="tabmore"'
|
var STOPE = 'lay-stope="tabmore"';
|
||||||
,span = $('<span class="layui-unselect layui-tab-bar" '+ STOPE +'><i '+ STOPE +' class="layui-icon"></i></span>');
|
var span = $('<span class="layui-unselect layui-tab-bar" '+ STOPE +'><i '+ STOPE +' class="layui-icon"></i></span>');
|
||||||
|
|
||||||
if(that === window && device.ie != 8){
|
if(that === window && device.ie != 8){
|
||||||
call.hideTabMore(true)
|
// call.hideTabMore(true)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 开启关闭图标
|
// 开启关闭图标
|
||||||
|
@ -210,16 +215,24 @@ layui.define('jquery', function(exports){
|
||||||
if(typeof othis.attr('lay-unauto') === 'string') return;
|
if(typeof othis.attr('lay-unauto') === 'string') return;
|
||||||
|
|
||||||
// 响应式
|
// 响应式
|
||||||
if(title.prop('scrollWidth') > title.outerWidth()+1){
|
if(
|
||||||
|
title.prop('scrollWidth') > title.outerWidth() + 1 ||
|
||||||
|
title.height() > title.find('li').eq(0).height()
|
||||||
|
){
|
||||||
|
// 若执行是来自于切换,则自动展开
|
||||||
|
spread && title.addClass(MORE);
|
||||||
|
|
||||||
if(title.find('.'+BAR)[0]) return;
|
if(title.find('.'+BAR)[0]) return;
|
||||||
title.append(span);
|
title.append(span);
|
||||||
othis.attr('overflow', '');
|
othis.attr('overflow', '');
|
||||||
|
|
||||||
|
// 展开图标事件
|
||||||
span.on('click', function(e){
|
span.on('click', function(e){
|
||||||
title[this.title ? 'removeClass' : 'addClass'](MORE);
|
var isSpread = title.hasClass(MORE);
|
||||||
this.title = this.title ? '' : '收缩';
|
title[isSpread ? 'removeClass' : 'addClass'](MORE);
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
title.find('.'+BAR).remove();
|
title.find('.'+ BAR).remove();
|
||||||
othis.removeAttr('overflow');
|
othis.removeAttr('overflow');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -530,7 +543,7 @@ layui.define('jquery', function(exports){
|
||||||
});
|
});
|
||||||
|
|
||||||
dom.on('click', '.layui-tab-title li', call.tabClick); // Tab 切换
|
dom.on('click', '.layui-tab-title li', call.tabClick); // Tab 切换
|
||||||
dom.on('click', call.hideTabMore); // 隐藏展开的 Tab
|
// dom.on('click', call.hideTabMore); // 隐藏展开的 Tab
|
||||||
$(window).on('resize', call.tabAuto); // 自适应
|
$(window).on('resize', call.tabAuto); // 自适应
|
||||||
|
|
||||||
exports(MOD_NAME, element);
|
exports(MOD_NAME, element);
|
||||||
|
|
|
@ -2817,6 +2817,7 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
|
cols = layui.isArray(cols) ? cols : [cols];
|
||||||
layui.each(cols, function (i1, item1) {
|
layui.each(cols, function (i1, item1) {
|
||||||
that.eachCols(function (i2, item2) {
|
that.eachCols(function (i2, item2) {
|
||||||
if (item1.field === item2.field) {
|
if (item1.field === item2.field) {
|
||||||
|
|
|
@ -64,7 +64,7 @@ layui.define('jquery', function(exports){
|
||||||
// 设置 bar 相关属性
|
// 设置 bar 相关属性
|
||||||
elemBar.addClass(item.icon).attr({
|
elemBar.addClass(item.icon).attr({
|
||||||
'lay-type': item.type,
|
'lay-type': item.type,
|
||||||
'style': item.style || ('background-color: '+ options.bgcolor || '')
|
'style': item.style || (options.bgcolor ? 'background-color: '+ options.bgcolor : '')
|
||||||
}).html(item.content);
|
}).html(item.content);
|
||||||
|
|
||||||
// bar 点击事件
|
// bar 点击事件
|
||||||
|
|
Loading…
Reference in New Issue