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

 更新时间:2016年05月19日 16:12:56   投稿:jingxian  
下面小编就为大家带来一篇jquery遍历table的tr获取td的值实现方法。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

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的值实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • jQuery实现发送验证码并60秒倒计时功能

    jQuery实现发送验证码并60秒倒计时功能

    这篇文章主要介绍了jQuery实现发送验证码并60秒倒计时功能,非常不错,代码简单易懂,需要的朋友参考下吧
    2016-11-11
  • jQuery实现贪吃蛇小游戏(附源码下载)

    jQuery实现贪吃蛇小游戏(附源码下载)

    网上关于JS实现贪吃蛇的文章有很多,最近闲来无事,想着利用jQury来实现贪吃蛇小游戏,下面实现这篇文章主要介绍了利用jQuery实现贪吃蛇小游戏的方法,文中给出的是吸纳思路和示例代码,需要的朋友可以参考下。
    2017-03-03
  • JQuery 国际象棋棋盘 实现代码

    JQuery 国际象棋棋盘 实现代码

    前些时候为了熟悉国际象棋的各种开局,随手写了一个很简单的国际象棋棋盘(实在找不到现成的)。
    2009-06-06
  • jquery插件实现图片对比

    jquery插件实现图片对比

    这篇文章主要为大家详细介绍了jquery插件实现图片对比,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04
  • jquery实现动态画圆

    jquery实现动态画圆

    这篇文章主要给大家分享了一段jquery实现动态画圆代码,需要的朋友可以参考下
    2014-12-12
  • jQuery实现异步获取json数据的2种方式

    jQuery实现异步获取json数据的2种方式

    这篇文章主要介绍了jQuery实现异步获取json数据的2种方式,主要讲述了$.getJSON方法与$.ajax方法,非常实用,需要的朋友可以参考下
    2014-08-08
  • jQuery实现获取table表格第一列值的方法

    jQuery实现获取table表格第一列值的方法

    这篇文章主要介绍了jQuery实现获取table表格第一列值的方法,涉及jQuery针对table表格元素的遍历与读取相关技巧,需要的朋友可以参考下
    2016-03-03
  • jquery选择器中的空格与大于号>、加号+与波浪号~的区别介绍

    jquery选择器中的空格与大于号>、加号+与波浪号~的区别介绍

    这篇文章主要介绍了jquery选择器中的空格与大于号>、加号+与波浪号~的区别介绍的相关资料,需要的朋友可以参考下
    2016-06-06
  • jQuery样式操作方法整理介绍

    jQuery样式操作方法整理介绍

    这篇文章主要介绍了jQuery样式操作方法,并通过实际案例更浅显的理解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习吧
    2022-10-10
  • jQuery easyui刷新当前tabs的方法

    jQuery easyui刷新当前tabs的方法

    这篇文章给大家介绍了jquery easyui刷新当前tabs的方法,本文涉及到param参数的属性知识点,本文通过实例给大家介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起看看吧
    2016-09-09

最新评论