javascript实现table单元格点击展开隐藏效果(实例代码)
更新时间：2017年04月10日 08:45:51 作者：下小朋友
这篇文章主要介绍了javascript实现table单元格点击展开隐藏效果的实例代码讲解，代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友可以参考下
如果table元素的高如果不设置，是根据内容撑开的，根据这个规则，可以用js控制默认状态下table-cell的宽度，并将这一列的table-cell设置为dispaly：block，这样多出来的内容就会被隐藏掉，添加点击事件，把table-cell的display在block和table-cell之间切换，就能实现点击展开隐藏效果啦！
js代码如下：
$('.cell').click(function(){
if($(this).css('display')=='block'){
console.log('ok');
$(this).css('display'，'table-cell');
}else{
$(this).css('display'，'block');
}
});
超级简单！不过设置为block之后，表格的border重叠就会失效，要对这个动态的列单独再设置一下样式，去掉它的边框~
相关文章
这篇文章主要介绍了JS中input表单隐藏域及其使用方法讲解，非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-02-02
这篇文章主要介绍了如何去除js中的json存在的转义字符\问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
这篇文章主要介绍了点评js异步加载的4种方式，帮助大家更全面的了解js异步加载方式，感兴趣的小伙伴们可以参考一下2015-12-12
最近掌门人在写3D游戏,对于其中的物理效果很感兴趣,今天我将使用纯JavaScript来实现一个简易的物理模拟,其中包括碰撞检测与响应、摩擦力与空气阻力、以及物体的破坏效果,文中通过代码示例讲解的非常详细,需要的朋友可以参考下2024-01-01
这篇文章主要介绍了如何用JS求Number类型数组中最大元素2018-04-04
之前的弹出层做的挺好，但是代码结构有问题，这次用到了，重构了一下，改为jQuery的插件形式，感觉还不错，有兴趣的朋友可以参考下，希望可以帮助到你2013-04-04
这篇文章主要为大家详细介绍了JS实现炫酷雪花飘落效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-08-08
这篇文章主要介绍了JavaScript的流程控制语句，感兴趣的小伙伴们可以参考一下2015-11-11
这篇文章主要介绍了JavaScript Window浏览器对象模型,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-05-05
这篇文章主要为大家详细介绍了laydate日历控件的使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-11-11
最新评论