JavaScript控制table某列不显示的方法


Posted in Javascript onMarch 16, 2015

本文实例讲述了JavaScript控制table某列不显示的方法。分享给大家供大家参考。具体实现方法如下:

1、table代码

<table id="mytable" border="0" width="1400" align="center"  

  cellpadding="3" cellspacing="1" bgcolor="#dfdfdf">

  <tbody id="tbody1" style="background: #e4e9f0; font-weight: bold;">

      <tr class="gray12">

          <td width="120" bgcolor="#FFFFFF">日期</td>

          <td width="120" bgcolor="#FFFFFF">媒体名称</td>

          <td width="200" bgcolor="#FFFFFF">投放形式</td>

          <td width="120" bgcolor="#FFFFFF">曝光次数</td>

          <td width="120" bgcolor="#FFFFFF">曝光人数</td>

          <td width="120" bgcolor="#FFFFFF">点击次数</td>

          <td width="120" bgcolor="#FFFFFF">点击人数</td>

          <td width="120" bgcolor="#FFFFFF">CTR</td>

          <td width="120" bgcolor="#FFFFFF">访次</td>

          <td width="120" bgcolor="#FFFFFF">跳出次数</td>

          <td width="120" bgcolor="#FFFFFF">访问深度</td>

          <td width="120" bgcolor="#FFFFFF">浏览时长/秒</td>

          <td width="120" bgcolor="#FFFFFF">参与活动人数</td>

          <td width="120" bgcolor="#FFFFFF">办理业务人数</td>

      </tr>

  </tbody>

  <tbody id="detail_id"></tbody>

</table>

2、js根据权限控制

注:如果数据是动态数据,当赋值完后再控制显示td,否则会造成td头控制成功,其他行失败的情况

if (uname === "guest") {
 $("#mytable tr").each(function() {
   $(this).find("td").eq(7).css("display", "none");
   $(this).find("td").eq(8).css("display", "none");
   $(this).find("td").eq(9).css("display", "none");
   $(this).find("td").eq(10).css("display", "none");
   $(this).find("td").eq(11).css("display", "none");
   $(this).find("td").eq(12).css("display", "none");
   $(this).find("td").eq(13).css("display", "none");
 });
}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
插件:检测javascript的内存泄漏
Mar 04 Javascript
iframe的父子窗口之间的对象相互调用基本用法
Sep 03 Javascript
jquery live()重复绑定的解决方法介绍
Jan 03 Javascript
ExtJs纵坐标值重复问题的解决方法
Feb 27 Javascript
使用AngularJS实现表单向导的方法
Jun 19 Javascript
JS组件Bootstrap Table表格行拖拽效果实现代码
Aug 27 Javascript
jQuery+css实现的时钟效果(兼容各浏览器)
Jan 27 Javascript
Bootstrap实现提示框和弹出框效果
Jan 11 Javascript
Vue.directive自定义指令的使用详解
Mar 10 Javascript
JS实现的简单拖拽购物车功能示例【附源码下载】
Jan 03 Javascript
基于react后端渲染模板引擎noox发布使用
Jan 11 Javascript
electron 如何将任意资源打包的方法步骤
Apr 16 Javascript
详解addEventListener的三个参数之useCapture
Mar 16 #Javascript
解决Jquery向页面append新元素之后事件的绑定问题
Mar 16 #Javascript
jquery中radio checked问题
Mar 16 #Javascript
jquery中JSON的解析方式
Mar 16 #Javascript
浅谈js中的闭包
Mar 16 #Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 #Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
Mar 15 #Javascript
You might like
《忧国的莫里亚蒂》先导宣传图与STAFF公开
2020/03/04 日漫
第十四节 命名空间 [14]
2006/10/09 PHP
PHP SEO优化之URL优化方法
2011/04/21 PHP
php实现的XML操作(读取)封装类完整实例
2017/02/23 PHP
静态的动态续篇之来点XML
2006/08/15 Javascript
数组Array进行原型prototype扩展后带来的for in遍历问题
2010/02/07 Javascript
通过百度地图获取公交线路的站点坐标的js代码
2012/05/11 Javascript
通过jQuery源码学习javascript(二)
2012/12/27 Javascript
jQuery中fadeIn、fadeOut、fadeTo的使用方法(图片显示与隐藏)
2013/05/08 Javascript
把jquery 的dialog和ztree结合实现步骤
2013/08/02 Javascript
jquery跟js初始化加载的多种方法及区别介绍
2014/04/02 Javascript
javascript数组操作方法小结和3个属性详细介绍
2014/07/05 Javascript
jquery实现垂直和水平菜单导航栏
2020/08/27 Javascript
Bootstrap3 内联单选和多选框
2016/12/29 Javascript
javascript简单链式调用案例分析
2017/05/10 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
VUE长按事件需求详解
2017/10/18 Javascript
mui上拉加载更多下拉刷新数据的封装过程
2017/11/03 Javascript
AngularJS基于http请求实现下载php生成的excel文件功能示例
2018/01/23 Javascript
highcharts.js数据绑定方式代码实例
2019/11/13 Javascript
javascript实现弹幕墙效果
2019/11/28 Javascript
vue-router 2.0 跳转之router.push()用法说明
2020/08/12 Javascript
[40:12]Liquid vs Chaos 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python用BeautifulSoup库简单爬虫实例分析
2018/07/30 Python
Python 带有参数的装饰器实例代码详解
2018/12/06 Python
浅谈python3.x pool.map()方法的实质
2019/01/16 Python
jupyter notebook 多环境conda kernel配置方式
2020/04/10 Python
python 将视频 通过视频帧转换成时间实例
2020/04/23 Python
Python3爬虫里关于Splash负载均衡配置详解
2020/07/10 Python
canvas简单连线动画的实现代码
2020/02/04 HTML / CSS
意大利折扣和优惠券网站:Groupalia
2019/10/09 全球购物
大专生自我鉴定范文
2013/10/01 职场文书
彩妆大赛策划方案
2014/05/13 职场文书
旅游与酒店管理专业求职信
2014/07/21 职场文书
材料员岗位职责
2015/02/10 职场文书
如何用Laravel包含你自己的帮助函数
2021/05/27 PHP