layui的选项卡(tab)的问题
当页面打开单个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)的问题的更多相关文章
- 选项卡 tab切换
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- VUE实现Studio管理后台(二):Slot实现选项卡tab切换效果,可自由填装内容
作为RXEditor的主界面,Studio UI要使用大量的选项卡TAB切换,我梦想的TAB切换是可以自由填充内容的.可惜自己不会实现,只好在网上搜索一下,就跟现在你做的一样,看看有没有好事者实现了类 ...
- layui超链接追加tab选项卡必须手动刷新才出现问题
在admin.js中tabAdd方法里 var li = $("#WeTabTip li[lay-id=" + id + "]").length;中的id外面加 ...
- jQuery的DOM操作实例(1)——选项卡&&Tab切换
一.原生JavaScript编写tab切换 二.jQuery编写tab切换 在用jQuery编写选项卡过程中,重要的事搞清楚 .eq() 和 .index() 的使用方法. .eq()是jQuery遍 ...
- jq的选项卡tab
jq中选项卡很简单,的注意是他结构命名(网上有很多,其中不乏不规范) 1.tab 2.tab-hd (选项栏) 3.tab-bd(选项栏对应的内容) css代码(布局没问题,可以只看jquery代码) ...
- jQuery插件学习之选项卡Tab
在网站开发中经常会用到选项卡功能,为了节省一下写代码时间,封装了一下tab插件,方便调用. 来看一下效果: tab-1 tab-2 tab-3 tabs-1-panel tabs-2-panel ta ...
- Mui 选项卡 tab 高度 没有自适应....
因为项目中 用到了 mui ,mui 的选项卡有时候无法自适应高度,这回导致有的tab 出现一大片空白区域... 从jquery 的 思路 是 用一个值 保存 当前 的 高度... 当 点击其他 t ...
- layui中的tab切换
tab切换是常见的效果,为了方便经常使用插架中自带的,下面是layui中自带的tab切换效果, 主要代码如下: <!DOCTYPE html> <html lang="en ...
- layui tabs选项卡 响应试不显示问题
添加: var element = layui.element; //Tab的切换功能,切换事件监听等,需要依赖element模块 element.init();
随机推荐
- bash arithmatic
Arithmetic in bash is done with $ and double parentheses: echo "$(($num1+$num2))" Or $ and ...
- centos 7 安装mysql5.7
1.进入到要存放安装包的位置 cd /home/lnmp 2.查看系统中是否已安装 MySQL 服务,以下提供两种方式: rpm -qa | grep mysql yum list installed ...
- Eureka 系列(05)消息广播(上):消息广播原理分析
Eureka 系列(05)消息广播(上):消息广播原理分析 [TOC] 0. Spring Cloud 系列目录 - Eureka 篇 首先回顾一下客户端服务发现的流程,在上一篇 Eureka 系列( ...
- 一份详尽的 Java 问题排查工具清单,值得收藏!
| grep 5 -A 3 #上匹配seq 10 | grep 5 -B 3 #下匹配seq 10 | grep 5 -C 3 #上下匹配,平时用这个就妥了cat f.txt | g ...
- zabbix--External checks 外部命令检测
概述zabbix server 运行脚本或者二进制文件来执行外部检测,外部检测不需要在被监控端运行任何 agentditem key 语法如下: 参数 定义 script shell 脚本或者二进制文 ...
- LeetCode Array Easy 122. Best Time to Buy and Sell Stock II
Description Say you have an array for which the ith element is the price of a given stock on day i. ...
- celery使用的小记录
一篇还不错的入门说明: http://www.bjhee.com/celery.html, 官方文档: http://docs.jinkan.org/docs/celery/getting-start ...
- 使用 Audacity 录制声卡声音
在Linux中使用 Audacity 录制电脑播放的声音非常简单,其实主要设置不在 Audacity 上,而是要设置好输入设备并选择对录音输入源. 首先确认输入设备中 内置音频的Monitor 没有被 ...
- sql中char,varchar,nvarchar的区别
char[n] 是定长的,也就是当存储字符小于n时,他会自动补齐(补空值).优点:效率较varchar高. varchar[n]是变长且非unicode字符数据类型,n的取值在1到8000之间,该类型 ...
- {"timestamp":"2019-11-12T02:39:28.949+0000","status":415,"error":"Unsupported Media Type","message":"Content type 'text/plain;charset=UTF-8' not supported","path":&quo
在Jmeter运行http请求时报错: {"timestamp":"2019-11-12T02:39:28.949+0000","status&quo ...