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 相关文章推荐
firefox下对ajax的onreadystatechange的支持情况分析
Dec 14 Javascript
JavaScript的漂亮的代码片段
Jun 05 Javascript
jquery实现倒计时代码分享
Jun 13 Javascript
jquery的clone方法应用于textarea和select的bug修复
Jun 26 Javascript
用js判断是否为360浏览器的实现代码
Jan 15 Javascript
JavaScript中利用Array和Object实现Map的方法
Jul 27 Javascript
第一次动手实现bootstrap table分页效果
Sep 22 Javascript
详解vue跨组件通信的几种方法
Jun 15 Javascript
react配置antd按需加载的使用
Feb 11 Javascript
js实现图片粘贴到网页
Dec 06 Javascript
Windows下安装 node 的版本控制工具 nvm
Feb 06 Javascript
vue设置全局访问接口API地址操作
Aug 14 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
深入解析php模板技术原理【一】
2008/01/10 PHP
Yii2语言国际化自动配置详解
2018/08/22 PHP
PHP文件打开关闭及读写操作示例解析
2020/08/06 PHP
addEventListener 的用法示例介绍
2014/05/07 Javascript
JavaScript中的单引号和双引号报错的解决方法
2014/09/01 Javascript
jquery操作angularjs对象
2015/06/26 Javascript
Jquery实现纵向横向菜单
2016/01/24 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
2016/06/12 Javascript
Jquery实现上下移动和排序代码
2016/10/17 Javascript
js实现砖头在页面拖拉效果
2020/11/20 Javascript
JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)
2017/07/07 Javascript
菊花转动的jquery加载动画效果
2018/08/19 jQuery
纯javascript前端实现base64图片下载(兼容IE10+)
2018/09/14 Javascript
CSS3 动画卡顿性能优化的完美解决方案
2018/09/20 Javascript
html+vue.js 实现漂亮分页功能可兼容IE
2020/11/07 Javascript
使用Mock.js生成前端测试数据
2020/12/13 Javascript
详解Vue.js 可拖放文本框组件的使用
2021/03/03 Vue.js
[57:59]EG vs Secret 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
Python实现在Linux系统下更改当前进程运行用户
2015/02/04 Python
用Python代码来解图片迷宫的方法整理
2015/04/02 Python
Python设计模式中单例模式的实现及在Tornado中的应用
2016/03/02 Python
python matplotlib 注释文本箭头简单代码示例
2018/01/08 Python
python os.listdir按文件存取时间顺序列出目录的实例
2018/10/21 Python
Python文本处理简单易懂方法解析
2019/12/19 Python
Jupyter Notebook的连接密码 token查询方式
2020/04/21 Python
联想中国官方商城:Lenovo China
2017/10/18 全球购物
印尼美容产品购物网站:PerfectBeauty.id
2017/12/01 全球购物
澳大利亚排名第一的露营和户外设备在线零售商:Outbax
2020/05/06 全球购物
你常见到的runtime exception
2016/09/05 面试题
说出ArrayList,Vector, LinkedList的存储性能和特性
2015/01/04 面试题
美容院考勤制度
2014/01/30 职场文书
老师的检讨书
2014/02/23 职场文书
无传销社区工作方案
2014/05/13 职场文书
高考升学宴答谢词
2015/01/20 职场文书
趵突泉导游词
2015/02/03 职场文书
齐云山导游词
2015/02/06 职场文书