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 相关文章推荐
js 日期转换成中文格式的函数
Jul 07 Javascript
JS左右无缝滚动(一般方法+面向对象方法)
Aug 17 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
Dec 28 Javascript
详解JavaScript函数
Dec 01 Javascript
Javascript中的数组常用方法解析
Jun 17 Javascript
完美解决JS文件页面加载时的阻塞问题
Dec 18 Javascript
基本DOM节点操作
Jan 17 Javascript
超全面的JavaScript开发规范(推荐)
Jan 21 Javascript
JavaScript事件处理程序详解
Sep 19 Javascript
vue单页面应用打开新窗口显示跳转页面的实例
Sep 21 Javascript
javaScript中indexOf用法技巧
Nov 26 Javascript
vue-quill-editor插入图片路径太长问题解决方法
Jan 08 Vue.js
详解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
php获得当前的脚本网址
2007/12/10 PHP
一步一步学习PHP(6) 面向对象
2010/02/16 PHP
PHP可变函数的使用详解
2013/06/14 PHP
PHP接收json 并将接收数据插入数据库的实现代码
2015/12/01 PHP
基于CI(CodeIgniter)框架实现购物车功能的方法
2018/04/09 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
javascript 树控件 比较好用
2009/06/11 Javascript
javaScript 数值型和字符串型之间的转换
2009/07/25 Javascript
使用Microsoft Ajax Minifier减小JavaScript文件大小的方法
2010/04/01 Javascript
表格单元格交错着色实现思路及代码
2013/04/01 Javascript
jquery.uploadify插件在chrome浏览器频繁崩溃解决方法
2015/03/01 Javascript
javascript实现确定和取消提示框效果
2015/07/10 Javascript
基于javascript代码实现通过点击图片显示原图片
2015/11/29 Javascript
深入理解逻辑表达式的用法 与或非的用法
2016/06/06 Javascript
AngularJS递归指令实现Tree View效果示例
2016/11/07 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
2018/05/30 Javascript
vue展示dicom文件医疗系统的实现代码
2018/08/27 Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
2018/10/18 Javascript
JavaScript数组特性与实践应用深入详解
2018/12/30 Javascript
vue项目中使用vue-i18n报错的解决方法
2019/01/13 Javascript
用python实现简单EXCEL数据统计的实例
2017/01/24 Python
基于python 字符编码的理解
2017/09/02 Python
基于Python的文件类型和字符串详解
2017/12/21 Python
今天 平安夜 Python 送你一顶圣诞帽 @微信官方
2017/12/25 Python
win7+Python3.5下scrapy的安装方法
2018/07/31 Python
Python实现html转换为pdf报告(生成pdf报告)功能示例
2019/05/04 Python
对python3 Serial 串口助手的接收读取数据方法详解
2019/06/12 Python
使用python爬取微博数据打造一颗“心”
2019/06/28 Python
快速解决docker-py api版本不兼容的问题
2019/08/30 Python
如何基于Python代码实现高精度免费OCR工具
2020/06/18 Python
python中用Scrapy实现定时爬虫的实例讲解
2021/01/18 Python
HTML5拖放功能_动力节点Java学院整理
2017/07/13 HTML / CSS
法国房车租赁网站:Yescapa
2019/08/26 全球购物
信仰心得体会
2014/09/05 职场文书
2015廉洁自律个人总结
2015/02/14 职场文书
pandas时间序列之pd.to_datetime()的实现
2022/06/16 Python