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

前端技术 2023/09/03 JavaScript

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

本文地址：https://www.stayed.cn/item/6085

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案