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 Math对象
Aug 13 Javascript
js中eval()函数和trim()去掉字符串左右空格应用
Feb 02 Javascript
js实现类似于add(1)(2)(3)调用方式的方法
Mar 04 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
Oct 10 Javascript
AngualrJS中每次$http请求时的一个遮罩层Directive
Jan 26 Javascript
Bootstrap前端开发案例二
Jun 17 Javascript
总结JavaScript在IE9之前版本中内存泄露问题
Apr 28 Javascript
基于vue2的canvas时钟倒计时组件步骤解析
Nov 05 Javascript
vue多层嵌套路由实例分析
Mar 19 Javascript
小程序input数据双向绑定实现方法
Oct 17 Javascript
js实现星星打分效果
Jul 05 Javascript
React中的Context应用场景分析
Jun 11 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
php中支持多种编码的中文字符串截取函数!
2007/03/20 PHP
php ss7.5的数据调用 (笔记)
2010/03/08 PHP
Drupal简体中文语言包安装教程
2014/09/27 PHP
PHP curl伪造IP地址和header信息代码实例
2015/04/27 PHP
详解PHP使用日期时间处理器Carbon人性化显示时间
2017/08/10 PHP
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
精通Javascript系列之数值计算
2011/06/07 Javascript
js获取select标签选中值的两种方式
2014/01/09 Javascript
js使用ajax读博客rss示例
2014/05/06 Javascript
jquery 无限极下拉菜单的简单实例(精简浓缩版)
2016/05/31 Javascript
JS仿hao123导航页面图片轮播效果
2016/09/01 Javascript
bootstrap下拉列表与输入框组结合的样式调整
2016/10/08 Javascript
自定义require函数让浏览器按需加载Js文件
2016/11/24 Javascript
ES6新特性之函数的扩展实例详解
2017/04/01 Javascript
浅谈函数调用的不同方式,以及this的指向
2017/09/17 Javascript
详解webpack babel的配置
2018/01/09 Javascript
JSON数据中存在单个转义字符“\”的处理方法
2018/07/11 Javascript
解决vue 中 echart 在子组件中只显示一次的问题
2018/08/07 Javascript
Vue.js自定义指令学习使用详解
2019/10/19 Javascript
关于vue3.0中的this.$router.replace({ path: '/'})刷新无效果问题
2020/01/16 Javascript
javascript实现前端成语点击验证优化
2020/06/24 Javascript
基于Python闭包及其作用域详解
2017/08/28 Python
Python创建二维数组实例(关于list的一个小坑)
2017/11/07 Python
Python 中导入csv数据的三种方法
2018/11/01 Python
python3 selenium自动化 frame表单嵌套的切换方法
2019/08/23 Python
python自动结束mysql慢查询会话的实例代码
2019/10/27 Python
python绘制随机网络图形示例
2019/11/21 Python
通过python 执行 nohup 不生效的解决
2020/04/16 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
python软件都是免费的吗
2020/06/18 Python
Python识别处理照片中的条形码
2020/11/16 Python
房产销售经理职责
2013/12/20 职场文书
网上快餐厅创业计划书
2014/02/01 职场文书
电气自动化个人求职信范文
2014/02/03 职场文书
扩大国家免疫规划实施方案
2014/03/21 职场文书
继承公证书样本
2014/04/04 职场文书