html表格统计表,jQuery操作表格(table)的常用方法、技巧汇总

以下列出13个jQuery操作table常用到的功能:

1.鼠标移动行变色

$('#table1 tr').hover(function(){

$(this).children('td').addClass('hover')

}, function(){

$(this).children('td').removeClass('hover')

});

方法二:

$("#table1 tr:gt(0)").hover(function() {

$(this).children("td").addClass("hover");

}, function() {

$(this).children("td").removeClass("hover");

});

2.奇偶行不同颜色

$('#table1 tbody tr:odd').css('background-color', '#bbf');

$('#table1 tbody tr:even').css('background-color','#ffc');

//操作class

$("#table1 tbody tr:odd").addClass("odd");

$("#table1 tbody tr:even").addClass("even");

3.隐藏一行

$('#table1 tbody tr:eq(3)').hide();

$("#table1 tr td::nth-child(3)").hide();

$("#table1 tr").each(function(){$("td:eq(3)",this).hide()});

4.隐藏一列

$('#table1 tr td::nth-child(3)').hide();

5.删除一行

// 删除除第一行外的所有行

$('#table1 tr:not(:first)').remove();

// 删除指定行

$('#table1 tr:eq(3)').remove();

6.删除一列

// 删除除第一列外的所有列

$('#table1 tr th:not(:nth-child(1))').remove();

$('#table1 tr td:not(:nth-child(1))').remove();

// 删除第一列

$('#table1 tr td::nth-child(1)').remove();

7.得到(设置)某个单元格的值

// 设置table1,第2个tr的第一个td的值。

$('#table1 tr:eq(1) td:nth-child(1)').html('value');

// 获取table1,第2个tr的第一个td的值。

$('#table1 tr:eq(1) td:nth-child(1)').html();

8.插入一行

// 在第二个tr后插入一行

$('

插入3插入插入插入').insertAfter($('#table7 tr:eq(1)'));

9.获取每一行指定的单元格的值

var arr = [];

$('#table1 tr td:nth-child(1)').each(function (key, value) {

arr.push($(this).html());

});

var result = arr.join(',');

10.全选或全不选

//方法零:

$('#all').on('click', function () {

$('input.checkSub').prop('checked', this.checked); // 给当前一起绑定的子选择添加效果

});

//方法一:

//全选或全不选 此传入的参数为event 如:checkAll(event)

function checkAll(evt){

evt=evt?evt:window.event;

var chall=evt.target?evt.target:evt.srcElement;

var tbl=$("#table1");

var trlist=tbl.find("tr");

for(var i=1;i

var tr=$(trlist[i]);

var input=tr.find("INPUT[type='checkbox']");

input.attr("checked",chall.checked);

}

}

//方法二:

//全选或全不选 此传入的参数为this 如:checkAll(this)

function checkAll(evt){

var tbl=$("#table1");

var trlist=tbl.find("tr");

for(var i=1;i

var tr=$(trlist[i]);

var input=tr.find("INPUT[type='checkbox']");

input.attr("checked",evt.checked);

}

}

//方法三:

//全选或全不选 此传入的参数为this 如:checkAll(this)

function checkAll(evt){

$("#table1 tr").find("input[type='checkbox']").each(function(i){

$(this).attr("checked",evt.checked)

});

}

//方法四:

//全选或全不选 此传入的参数为this 如:checkAll(this)

function checkAll(evt){

$("#table1 tr").find("input[type='checkbox']").attr("checked",evt.checked);

}

11.客户端动态添加行

function btnAddRow(){

//行号是从0开始,最后一行是新增、删除、保存按钮行 故减去2

var rownum=$("#table1 tr").length-2;

var chk="";

var text="";

var sel="男女";

var row="

"+chk+""+text+""+sel+""+text+""+text+"";

$(row).insertAfter($("#table1 tr:eq("+rownum+")"));

}

12.客户端删除一行

每次只能删除一行,删除多行时出错

function btnDeleteRow(){

$("#table1 tr").find("input[type='checkbox']").each(function(i){

if($(this).attr("checked")){

if(i!=0){//不能删除行标题

$("#table1 tr:eq("+i+")").remove();

}

}

});

}

这个比上面的要好,可以一下删除多个记录

function btnDeleteRow(){

$("#table1 tr").each(function(i){

var chk=$(this).find("input[type='checkbox']");

if(chk.attr("id")!="checkall"){//不能删除标题行

if(chk.attr("checked")){

$(this).remove();

}

}

});

}

13.客户端保存

function btnSaveClick(){

//find()方法中我暂时不知道如何设定多个筛选条件,所以下面得不到select列表的值

//$("#table1 tr td").find("input[type='text']" || "select").each(function(i){

//alert($(this).val());

//});

$("#table1 tr").find("td").each(function(i){

if($(this).find("input[type='text']").length>0){

alert($(this).find("input[type='text']").val());

}else if($(this).find("select").length>0)

{

alert($(this).find("select").val());

}

});

}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/487678.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

收藏!中国卫星互联网产业发展白皮书

来源:网络传播杂志卫星互联网概念卫星互联网是基于卫星通信的互联网,通过发射一定数量的卫星形成规模组网,从而辐射全球,构建具备实时信息处理的大卫星系统,是一种能够完成向地面和空中终端提供宽带互联网接入等通信服…

数学在计算机科学上的应用文献,数学计算机论文,关于计算机在数学教学中的应用相关参考文献资料-免费论文范文...

导读:本文关于数学计算机论文范文,可以做为相关论文参考文献,与写作提纲思路参考。(新疆喀什地区塔什库尔干塔吉克自治县县中学数学教师 新疆喀什 845250)摘 要:人们在进入信息时代之后,计算机被广泛的应用在各个领域之中,教学中恰当的运用计算机,使很多知识都能清晰的展示在学…

输入流IS和输出流OS学习总结

1、我们编写的程序,除了自身会定义一些数据信息外,经常还会引用外界的数据,或是将自身的数据发送到外界,比如我们编写的程序想读取一个文本文件, 又或者是我们想将程序的一些数据写到一个文件中,这时我们就…

Attention最新进展

来自 | 知乎 作者|sisiyou链接 | https://zhuanlan.zhihu.com/p/130388873编辑 | 深度学习这件小事公众号本文主要总结了最新的关于attention的应用文章。Attention-based Dropout Layer for Weakly Supervised Object Localization(CVPR19&#xff09…

SQL Server 2012从零开始学pdf

下载地址:网盘下载内容介绍编辑《SQL Server 2012从零开始学》面向sql server 2012初学者,以及广大数据库设计爱好者。全书内容注重实用,涉及面广,通俗易懂地介绍了sql server 2012数据库应用与开发的相关基础知识,提供…

苹果html抓包,苹果被开发者“抓包”违反了自己定的规则

原标题:苹果被开发者“抓包”违反了自己定的规则【PConline资讯】消息:苹果在本周的发布会上推出了AppleNews订阅服务,虽然咱们是用不到,但这项服务最近b被开发者抓到了“小辫子”,因为它违反了苹果自己定的规则。根据…

前沿科技 | 中科院科学家在视觉学习行为的神经机制研究中取得进展

来源:中国科学院6月3日,《自然-通讯》(Nature Communications)期刊在线发表了题为《眶额叶皮层通过调节初级视皮层的反应增益促进视觉偶联学习》的研究论文,该研究由中国科学院科学家团队——脑科学与智能技术卓越创新…

Selenium-几种操作

元素定位之后就要对它进行操作了,常见的集中操作如下: click()  点击元素  eg.输入内容后,点击操作 send_keys("内容")  模拟按键输入  eg:百度输入框,输入内容 clear()  清除元素的内容  eg:清除百度输入框的内容 submit()  提交表单  eg:driver.fi…

桌面图标设计里的计算机是灰色的,小技巧教您如何将Windows 10上的桌面图标设置中的回收站为灰色!...

如果Windows10的桌面图标设置窗口中的回收站选项显示为灰色,则可以查看本逐步指南以解决问题。这将帮助您取回“桌面图标设置”面板中的“回收站”选项,以便您可以在桌面上显示或隐藏回收站。如果错误或任何恶意软件,广告软件等将其禁用&…

人工智能算法的可解释性方法研究

来源:数学与人工智能摘要以深度学习为代表的人工智能技术在信息领域的应用,极大地提高了信息的利用效率和挖掘价值,深刻的影响了各领域的业务形态,同时也引发了监管部门和用户对这一新技术运用中出现的 “算法黑箱”问题关切和疑虑…

asp:dropdownlist如何去掉三角箭头_一棵悬崖三角枫的培养过程

更多精彩,请点击上方思齐盆景关注!▲2010年4月上图是2010年春天购买的三角枫素材。这棵三角枫过渡流畅,曲度自然。入手后开始培养枝条。▲2012年3月转眼间两年过去了,枝条的培养略见成效。翻盆时打算按照上图的角度种植&#xff0…

征服用计算机弹法,征服WIN7

与Windows XP以及Vista系统相比,WIN7自上市以来便备受好评。速度更快的内核、更加时尚的外观、更强大的功能……一切都标志着微软视窗系统的又一次全新升级。如今,新购置电脑的朋友基本都已经用上了预装的WIN7,但面对功能如此强大的操作系统&…

表单项介绍

1 <!DOCTYPE html>2 <html>3 <head>4 <meta charset"UTF-8">5 <title></title>6 </head>7 <body>8 <!-- 9 表单的作用就是用来将用户信息提交给服务器的10 …

云联惠身份认证需要多长时间_欧盟REACH认证需要多长时间【周期、费用、有效期】...

一、欧盟reach认证REACH是欧盟关于化学品注册&#xff0c;评估&#xff0c;授权和限制的法规&#xff0c;它于2007年6月1日生效&#xff0c;并用一个系统取代了许多欧洲指令和法规。二、申请REACH认证需要多长时间一般情况下&#xff0c;申请REACH认证需要5个工作日&#xff0c…

Nature Neuroscience|群际冲突的脑间同步机制

本文来源&#xff1a;”认知神经科学与学习国家重点实验室”官网编辑&#xff1a;Yezi审阅&#xff1a;mingzlee7马燚娜课题组在《Nature Neuroscience》发表论文揭示群际冲突的脑间同步机制图片来源&#xff1a;《乌合之众——大众心理研究》插图个人一旦成为群体的一员&#…

计算机叫醒服务英语,关于酒店叫醒服务的英文口语

关于酒店叫醒服务的英文口语发布时间&#xff1a;2020-03-08春困秋乏夏打盹&#xff0c;睡不醒的冬三月……起床困难户小学妹今天要和大家聊聊使用酒店叫醒服务时会用到的实用口语。叫醒服务通常会用Morning call Service或是Wake-up call来表示&#xff0c;如果第二天有重要的…

一些常用的meta标签及其作用

声明文档使用的字符编码 <meta charsetutf-8>优先使用 IE 最新版本和 Chrome <meta http-equiv"X-UA-Compatible" content"IEedge,chrome1"/><meta name"wap-font-scale" content"no"> 页面描述 <meta name&q…

scala语言的底层是java实现的_2020了,每个程序员都该学习的 5 种开发语言

我曾在某处读到过&#xff08;可能在《代码大全》&#xff0c;但我不敢确定&#xff09;&#xff0c;程序员应该每年学习一门新的编程语言。但如果做不到&#xff0c;我建议&#xff0c;你至少学习以下 5 种开发语言&#xff0c;以便你在职业生涯有很好的表现。每个公司都喜爱精…

热议:大脑功能磁共振数据不可靠?杜克大学教授对自己15年的工作提出质疑...

来源&#xff1a;brainnews作者&#xff1a;brainnew创作团队杜克大学的研究人员对功能磁共振数据进行了重新测评&#xff0c;对自己15年的工作提出了质疑。脑部图像显示了不同的两天完成3个任务所对应的功能磁共振成像。图中&#xff0c;暖色显示一组人激活级别的一致性&#…

使用BUCK进行iOS项目打包

关于BUCK BUCK是Facebook开源的快速打包工具&#xff0c;可以用于多种语言及平台的项目打包&#xff0c;例如&#xff1a;C、C、Java、iOS、Android等等。用于大型的iOS、Android项目&#xff0c;可以显著提升打包效率。 关于BUCK介绍的一些链接如下&#xff1a; BUCK官网 What…