jquery遍历table的tr获取td的值实现方法


Posted in Javascript onMay 19, 2016

html代码:

<tbody id="history_income_list">
<tr>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><a class="" onclick="history_income_del(this);" href="###">删除</a></td>
</tr>
<tr>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><a class="" href="###">删除</a></td>
</tr>
<tr>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><input type="text" class="input-s input-w input-hs"></td>
<td align="center"><a class="" href="###">删除</a></td>
</tr>
</tbody>

方法一:

var trList = $("#history_income_list").children("tr")
  for (var i=0;i<trList.length;i++) {
    var tdArr = trList.eq(i).find("td");
    var history_income_type = tdArr.eq(0).find("input").val();//收入类别
    var history_income_money = tdArr.eq(1).find("input").val();//收入金额
    var history_income_remark = tdArr.eq(2).find("input").val();//  备注
    
    alert(history_income_type);
    alert(history_income_money);
    alert(history_income_remark);
  }

方法二:

$("#history_income_list").find("tr").each(function(){
    var tdArr = $(this).children();
    var history_income_type = tdArr.eq(0).find("input").val();//收入类别
    var history_income_money = tdArr.eq(1).find("input").val();//收入金额
    var history_income_remark = tdArr.eq(2).find("input").val();//  备注
    
    alert(history_income_type);
    alert(history_income_money);
    alert(history_income_remark);
    
    
  });

以上这篇jquery遍历table的tr获取td的值实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 面向对象(二)封装代码
May 23 Javascript
一行代码实现纯数据json对象的深度克隆实现思路
Jan 09 Javascript
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 Javascript
JS实现点击上移下移LI行数据的方法
Aug 05 Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
Mar 08 Javascript
JavaScript根据CSS的Media Queries来判断浏览设备的方法
May 10 Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 Javascript
Javascript中的arguments对象
Jun 20 Javascript
详解vue为什么要求组件模板只能有一个根元素
Jul 22 Javascript
js实现图片无缝循环轮播
Oct 28 Javascript
JavaScript基于用户照片姓名生成海报
May 29 Javascript
Openlayers绘制聚合标注
Sep 28 Javascript
jquery if条件语句的写法
May 19 #Javascript
laypage分页控件使用实例详解
May 19 #Javascript
js多功能分页组件layPage使用方法详解
May 19 #Javascript
深入理解MVC中的时间js格式化
May 19 #Javascript
Node.js+Express配置入门教程详解
May 19 #Javascript
浅析jquery数组删除指定元素的方法:grep()
May 19 #Javascript
基于jQuery的Web上传插件Uploadify使用示例
May 19 #Javascript
You might like
整理的一些实用WordPress后台MySQL操作命令
2013/01/07 PHP
php模拟服务器实现autoindex效果的方法
2015/03/10 PHP
php实现改变图片直接打开为下载的方法
2015/04/14 PHP
wamp服务器访问php非常缓慢的解决过程
2015/07/01 PHP
javascript new 需不需要继续使用
2009/07/02 Javascript
js 编程笔记 无名函数
2011/06/28 Javascript
html组件不可输入(只读)同时任何组件都有效
2013/04/01 Javascript
Seajs的学习笔记
2014/03/04 Javascript
jquery重复提交请求的原因浅析
2014/05/23 Javascript
jQuery固定浮动侧边栏实现思路及代码
2014/09/28 Javascript
javascript框架设计之类工厂
2015/06/23 Javascript
BootStrap实现响应式布局导航栏折叠隐藏效果(在小屏幕、手机屏幕浏览时自动折叠隐藏)
2016/11/30 Javascript
JS判断Android、iOS或浏览器的多种方法(四种方法)
2017/06/29 Javascript
JS实现获取毫秒值及转换成年月日时分秒的方法
2018/08/15 Javascript
Vue源码解析之数组变异的实现
2018/12/04 Javascript
react-native滑动吸顶效果的实现过程
2019/06/03 Javascript
vue实现简单跑马灯效果
2020/05/25 Javascript
[32:47]完美世界DOTA2联赛 GXR vs IO 第二场 11.07
2020/11/09 DOTA
Python使用MD5加密字符串示例
2014/08/22 Python
用Python脚本来删除指定容量以上的文件的教程
2015/05/04 Python
Python爬虫PyQuery库基本用法入门教程
2018/08/04 Python
python爬虫租房信息在地图上显示的方法
2019/05/13 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
关于tf.reverse_sequence()简述
2020/01/20 Python
python GUI库图形界面开发之PyQt5滚动条控件QScrollBar详细使用方法与实例
2020/03/06 Python
Django实现将一个字典传到前端显示出来
2020/04/03 Python
解决redis与Python交互取出来的是bytes类型的问题
2020/07/16 Python
python学习之使用Matplotlib画实时的动态折线图的示例代码
2021/02/25 Python
日语专业毕业生求职信
2013/12/04 职场文书
个人授权委托书范本
2014/04/03 职场文书
学前教育专业求职信
2014/09/02 职场文书
党员批评与自我批评(5篇)
2014/09/23 职场文书
个人借条范本
2015/05/25 职场文书
Win11怎样将锁屏账户头像图片改成动画视频
2021/11/21 数码科技
你知道Java Spring的两种事务吗
2022/03/16 Java/Android
MySql中的json_extract函数处理json字段详情
2022/06/05 MySQL