• 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"});
                    }                                
                  });

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

  • 相关阅读:
    程序员有哪些发展方向
    Mysql Join语法解析与性能分析
    jQuery过滤性选择器
    jQuery 基础选择器
    CSS布局模型
    CSS 盒子模型
    CSS 的继承、层叠和特殊性
    java 集合框架(一)
    从客户端中检测到有潜在危险的 Request.Form 值
    线程的一些问题
  • 原文地址:https://www.cnblogs.com/NeryXJ/p/10318392.html
Copyright © 2020-2023  润新知