Table中采用JQuery slideToggle效果的问题
需求:用JQuery实现,点击最上边的粗加号时,对所有含有子表的Tr进行展开,点击 + 号时,只对当前Tr的下一个tr内容的动态隐藏和显示;
问题:JQuery的slideToggle() slideUp() slideDown()是不支持在表格的tr上使用滑动效果的,所以不能通过 $(TrDom).slideToggle()来实现滑动
解决方法:把子Table包裹到一个Div中,然后通过 $(divDom).slideToggle()来实现滑动效果,需要注意的是,如果子表在页面加载时需要隐藏的话,那么就需要把tr所在的div设置为display:none,所以后面实现子表的滑动效果时还需要考虑所在tr的显示问题,解决方法是,对每个子表所对应的Tr也使用Toggle方法,以保持两者开关状态的一致性。

Table中采用JQuery slideToggle效果的问题的更多相关文章
- iview的table中Tooltip的使用
这篇文章主要介绍了iview-admin中在table中使用Tooltip提示效果. 1. table中文字溢出隐藏,提示气泡展示所有信息 jLongText(item){ item.render = ...
- Jquery Ajax 异步设置Table中某列的值
可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...
- bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- jQuery中的渐变动画效果
jQuery中的渐变动画效果jQuery中的渐变动画效果
- jQuery 在Table中选择input之类的东西注意事项
jQuery 在Table中选择input之类的东西注意事项: 如果不在td标签中,是不能进行正确选择的: <table id="tblFormId"> <tr& ...
- jQuery遍历table中的tr td并获取td中的值
jQuery遍历table中的tr td并获取td中的值 $(function(){ $("#tableId tr").find("td").each(func ...
- js操作table中tr的顺序,实现上移下移一行的效果
总体思路是在table外部加个div,修改div的innerHtml实现改变tr顺序的效果 具体思路是 获取当前要移动tr行的rowIndex,在table中删除掉,然后循环table的rows,到了 ...
- jquery 在 table 中修改某行值
修改 table 中某行的的方法步骤如下: 1.选择要修改的行,事件触发,比如我的 双击某行时修改 2.将要修改的行,替换为input,原先的列中的值,需要放到对应的input中作为默认值 3.修改完 ...
- 第86节:Java中的JQuery基础
第86节:Java中的JQuery 前言复习 定时器: setInterval clearInterval setTimeout clearTimeout 显示: img.style.display ...
随机推荐
- SRAtoolkit软件的使用介绍
Using the SRA Toolkit to convert .sra files into other formats Sequence Read Archive Submissions Sta ...
- swiper实现左右滑动图片
ref:http://www.swiper.com.cn/usage/index.html help:https://segmentfault.com/a/1190000002962202 src: ...
- UVaLive 5031 Graph and Queries (Treap)
题意:初始时给出一个图,每个点有一个权值,三种操作:(1)删除某个边:(2)修改每个点的权值:(3)询问与节点x在一个连通分量中所有点的第K大的权值. 析:首先是要先离线,然后再倒着做,第一个操作就成 ...
- 一个使用MVC3+NHibernate “增删改查” 的项目(修正版)
前言: 谈到NHibernate大伙并不陌生,搞Java的更是清楚,Hibernate是一个目前应用的最广泛的开放源代码的对象关系映射框架,它对Java的JDBC(类似于ADO.Net)进行了非常 ...
- Win7常用但是被忽略的快捷键
General keyboard shortcuts 1.Ctrl + Right Arrow Move the cursor to the beginning of the next word 向 ...
- Python中的矩阵、多维数组:Numpy
Numpy 是Python中科学计算的核心库.它提供一个高性能多维数据对象,以及操作这个对象的工具.部分功能如下: ndarray, 具有矢量算术运算和复杂广播能力的快速且节省空间的多维数组. 用于对 ...
- Mysql-15-mysql分布式应用
1.分布式应用的概念和优势 分布式数据库是指利用高速网络将物理上分散的多个数据存储单元连接起来组成一个逻辑上统一的数据库.分布式数据库的基本思想是将原来集中式数据库中的数据分散存储到多个通过网络连接的 ...
- Pod中spec的字段常用字段及含义
一.Pod中spec的字段常用字段及含义 1.pod.spec.containers ² spec.containers.name <string> #pod的名称,必须字段,名称唯一 ...
- Android Gradle 学习笔记(五):Gradle 任务 Task
在之前的学习中,我们了解到Gradle的构建工作都是由Task组合完成的.本节我们就来介绍一下 Task - 任务. 一.多种方式创建任务 在Gradle中,我们可以有很多种方式来创建任务.为什么有这 ...
- redis安全配置
禁用或者重命名危险命令 FLUSHDB, FLUSHALL, KEYS, PEXPIRE, DEL, CONFIG, SHUTDOWN, BGREWRITEAOF, BGSAVE, SAVE, SPO ...