当页面打开单个tab时,操作栏显示:

当页面打开多个tab时,会发现操作栏与下面第一个tab显示的操作栏类型一样,并且操作栏的按钮无作用

第一个标签操作栏显示:

产生这样的原因:使用layui时,每个tab的jsp页面操作栏的代码中的id是一样的.

<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs layui-bg-orange" lay-event="editEmp">修改</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delEmp">删除</a>
</script>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="delete">批量删除</button>
<button class="layui-btn layui-btn-sm" lay-event="addEmp">添加管理员</button>
</div>
</script>

解决方法:就是把每个jsp中的操作栏id改成不一样的.

layui的选项卡(tab)的问题的更多相关文章

  1. 选项卡 tab切换

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. VUE实现Studio管理后台(二):Slot实现选项卡tab切换效果,可自由填装内容

    作为RXEditor的主界面,Studio UI要使用大量的选项卡TAB切换,我梦想的TAB切换是可以自由填充内容的.可惜自己不会实现,只好在网上搜索一下,就跟现在你做的一样,看看有没有好事者实现了类 ...

  3. layui超链接追加tab选项卡必须手动刷新才出现问题

    在admin.js中tabAdd方法里 var li = $("#WeTabTip li[lay-id=" + id + "]").length;中的id外面加 ...

  4. jQuery的DOM操作实例(1)——选项卡&&Tab切换

    一.原生JavaScript编写tab切换 二.jQuery编写tab切换 在用jQuery编写选项卡过程中,重要的事搞清楚 .eq() 和 .index() 的使用方法. .eq()是jQuery遍 ...

  5. jq的选项卡tab

    jq中选项卡很简单,的注意是他结构命名(网上有很多,其中不乏不规范) 1.tab 2.tab-hd (选项栏) 3.tab-bd(选项栏对应的内容) css代码(布局没问题,可以只看jquery代码) ...

  6. jQuery插件学习之选项卡Tab

    在网站开发中经常会用到选项卡功能,为了节省一下写代码时间,封装了一下tab插件,方便调用. 来看一下效果: tab-1 tab-2 tab-3 tabs-1-panel tabs-2-panel ta ...

  7. Mui 选项卡 tab 高度 没有自适应....

    因为项目中 用到了 mui ,mui 的选项卡有时候无法自适应高度,这回导致有的tab 出现一大片空白区域... 从jquery 的 思路 是  用一个值 保存 当前 的 高度... 当 点击其他 t ...

  8. layui中的tab切换

    tab切换是常见的效果,为了方便经常使用插架中自带的,下面是layui中自带的tab切换效果, 主要代码如下: <!DOCTYPE html> <html lang="en ...

  9. layui tabs选项卡 响应试不显示问题

    添加: var element = layui.element; //Tab的切换功能,切换事件监听等,需要依赖element模块 element.init();

随机推荐

  1. FPGA 报错ERROR:Simulator:861 – Failed to link the design。

    问题综述: 我使用的是windows 10 32位专业版系统,电脑装的是ISE14.4版本,当我用此ISE自带的仿真器ISIM来仿真时,仿真器总是报错ERROR:Simulator:861 – Fai ...

  2. upc组队赛3 Congestion Charging Zon【模拟】

    Congestion Charging Zon 题目描述 Tehran municipality has set up a new charging method for the Congestion ...

  3. python学习笔记:使用freeze命令迁移模块

    使用freeze 给所有模块搬家 导出安装模块的文档pip freeze > my_freeze.txt 或者指定地址pip freeze > e:\my_freeze.txt 在另一个环 ...

  4. 实用maven笔记四-打包&其他

    通过使用maven的生命周期和丰富多样的插件,可以方便的将项目代码编译打包为自己需要的构件. maven默认项目主代码位置src/main/java目录,测试代码位置src/test/java目录.主 ...

  5. 2.3 Nginx服务的启停控制

    在Linux平台下,控制Nginx服务的启停有多种方法 2.3.1 Nginx服务的信号控制 在Nginx服务的启停办法中,有一类是通过信号机制来实现的,Nginx服务器的信号控制如下: Nginx服 ...

  6. flask获取参数

    <!DOCTYPE html> body, html { width: 100%; height: 100%; } , ::after, ::before { -webkit-box-si ...

  7. Linux部分常用命令详解(一)

    echo 命令详解 格式: echo string 显示普通字符: echo "it is a test" 或者 echo it is a test 显示转义字符: echo &q ...

  8. 在MVC4.5.1中使用Ninject

    看完Pro ASP.NET MVC5的前14章之后,终于开始了自己的项目搭建. 打算在实际项目中使用Ninject 但是总是出现各种问题.这里记录一下 在书中使用的Ninject的版本是: Insta ...

  9. github for windows 简单的客户端托管代码

    1)创建github账户 登录https://github.com,只需用户名.注册邮箱和登录密码便能注册一个属于自己的github(之后需要到注册邮箱中进行确认,非常喜欢这种注册方式,简单而且安全) ...

  10. 【LeetCode】Hash

    [451] Sort Characters By Frequency [Medium] 给一个字符串,要求返回按照字母出现频率的排序后的字符串.(哈希表+桶排) 有个技巧是Hash用Value作为In ...