jq+layui之tab页和欢迎页什么时候出现？

　　最近在做一个layui和jq做的后台框架。

　　当我们点击左边侧边栏的某一项时，右边出现tab项的相应的内容，这时候就难免会遇到这样子的一个问题：当我们编辑修改完之后，一个一个关闭tab项，当全部关闭后，我们要呈现给用户什么呢？

　　最容易想到的是，呈现刚进来这个页面时大家都能想到的欢迎介绍页。代码实现如下：

$(".layui-body").css({"display":"block"});

　　起初，我的思路是这样的：

iframe删除的监听：当所有的iframe删除完时，此时的data.index为0，通过if来显示出首页显示的欢迎页

　　实现的代码是这样的：

element.on('tabDelete(demo)', function(data){
                if(data.index==0){
                    $(".layui-body").css({"display":"block"});                                        
                }
              });    

　　你如果从tab的最右边一项开始删除，一直删到最左边，这没什么问题。但是，如果你从tab最左边开始删，你删掉了左边的第一个，欢迎页就出现了，和后边还没删除的tab页内容重叠了，惨不忍睹。

　　所以，我们要转换一个新的思路，舍弃通过data.index的值来决定什么时候出现欢迎页。

　　现在新的思路是：

每关闭一个tab，$(".layui-tab-title")，该元素下面的li的数量就减少一个通过剩余的li总数，来决定要不要显示首页（对应的需求是：如果tab项都关闭了，出现小象欢迎页）

　　怎么实现呢？且看下面：

　　

element.on('tabDelete(demo)', function(data){                    
                var tabCount=$(".layui-tab-title li[lay-id]").length;
                if(tabCount==0){
                    $(".layui-body").css({"display":"block"});
                }                                
              });

　　这样，欢迎页出现时机不对的问题也就被我们解决了。

转载于:https://www.cnblogs.com/NeryXJ/p/10318392.html