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中的传值与传引用
Dec 09 Javascript
jquery获取选中的文本和值的方法
Jul 08 Javascript
兼容各大浏览器的JavaScript阻止事件冒泡代码
Jul 09 Javascript
JS功能代码集锦
May 04 Javascript
Angular实现跨域(搜索框的下拉列表)
Feb 16 Javascript
js实现悬浮窗效果(支持拖动)
Mar 09 Javascript
node.js中cluster的使用教程
Jun 09 Javascript
React组件之间的通信的实例代码
Jun 27 Javascript
js 实现复选框只能选择一项的示例代码
Jan 23 Javascript
10分钟上手vue-cli 3.0 入门介绍
Apr 04 Javascript
vue的全局变量和全局拦截请求器的示例代码
Sep 13 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
Sep 19 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 fwrite写入txt文件的时候用 \r\n不能换行的问题
2013/08/06 PHP
php通过curl模拟登陆DZ论坛
2015/05/11 PHP
php数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
针对PHP开发安全问题的相关总结
2019/03/22 PHP
简单的php购物车代码
2020/06/05 PHP
工作中常用到的JS表单验证代码(包括例子)
2010/11/11 Javascript
javascript确认框的三种使用方法
2013/12/17 Javascript
javascript中的return和闭包函数浅析
2014/06/06 Javascript
js控制文本框输入的字符类型方法汇总
2015/06/19 Javascript
jquery插件jquery.LightBox.js实现点击放大图片并左右点击切换效果(附demo源码下载)
2016/02/25 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
2016/03/05 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
2016/04/17 Javascript
详解angular2采用自定义指令(Directive)方式加载jquery插件
2017/02/09 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
前端页面文件拖拽上传模块js代码示例
2017/05/19 Javascript
JS 验证密码 不能为空,必须含有数字、字母、特殊字符,长度在8-12位
2017/06/21 Javascript
Javascript的console['']常用输入方法汇总
2018/04/26 Javascript
让你5分钟掌握9个JavaScript小技巧
2018/06/09 Javascript
如何在微信小程序里面退出小程序的方法
2019/04/28 Javascript
vue服务端渲染操作简单入门实例分析
2019/08/28 Javascript
js判断非127开头的IP地址的实例代码
2020/01/05 Javascript
使用Python操作MySQL的一些基本方法
2015/08/16 Python
详解pandas.DataFrame中删除包涵特定字符串所在的行
2019/04/04 Python
Python实现多线程/多进程的TCP服务器
2019/09/03 Python
django从后台返回html代码的实例
2020/03/11 Python
HTML5 source标签:媒介元素定义媒介资源
2018/01/29 HTML / CSS
C#中的验证控件有几种
2014/03/08 面试题
J2ee常用的设计模式?说明工厂模式
2015/05/21 面试题
管理信息系学生的自我评价
2014/01/11 职场文书
法制宣传教育方案
2014/05/09 职场文书
食品安全处置方案
2014/06/14 职场文书
肖申克的救赎观后感
2015/06/02 职场文书
运动会观后感
2015/06/09 职场文书
2015年征兵工作总结
2015/07/23 职场文书
2019学校请假条格式及范文
2019/06/25 职场文书
python实现批量提取指定文件夹下同类型文件
2021/04/05 Python