jQuery-是否有更好的方法从表行中获取值?

前端之家收集整理的这篇文章主要介绍了jQuery-是否有更好的方法从表行中获取值? 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

说我有这个

<table border="1" id="tbl">
<tr>
<td><input type="checkBox" name="vehicle" value="Bike" /></td>
<td>row 1,cell 1</td>
<td>row 1,cell 2</td>
</tr>
<tr>
<td><input type="checkBox" name="vehicle" value="Bike" /></td>
<td>row 2,cell 1</td>
<td>row 2,cell 2</td>
</tr>
</table> 

现在,我要获取选中的行,然后获取该选中行的单元格值.所以我会这样做

 var cells = $('#tbl :checked').parents('tr').children('td');

因此,假设只能选中一个复选框(因此,没有jQuery foreach循环).

所以现在说我想获得第二个表格单元格的值

var secondCell = $(cells[1]).html();

尽管这样做会使代码变得如此脆弱.例如,如果我在复选框之后放置另一个表格单元格该怎么办?

<table border="1" id="tbl">
<tr>
<td><input type="checkBox" name="vehicle" value="Bike" /></td>
   <td> I am new </td>
  <td>row 1,cell 1</td>
  <td>row 1,cell 2</td>
</tr>
<tr>
<td><input type="checkBox" name="vehicle" value="Bike" /></td>
   <td> I am new </td>
  <td>row 2,cell 1</td>
  <td>row 2,cell 2</td>
</tr>
</table> 

所以现在我必须检查我的代码并更改它

var secondCell = $(cells[1]).html();

对此

var thirdCell = $(cells[2]).html();

从现在起,我实际上位于第三个单元之后,不再位于第二个单元之后.

那有更好的方法吗?

谢谢

最佳答案
给感兴趣的tds指定一个类名,以便您可以使用类名选择器选择它们.

<tr>
    <td><input type="checkBox" name="vehicle" value="Bike" /></td>
    <td> I am new </td>
    <td class="cell1">row 1,cell 1</td>
    <td class="cell2">row 1,cell 2</td>
</tr>

var row = $('#tbl :checked').parents('tr');
var cell1 = $('.cell1',row);
var cell2 = $('.cell2',row);

您可能还希望使用text()获取内容. html()也会返回任何您可能不感兴趣的包含HTML的内容.

您是否也考虑过使用< input type =“ radio”>强迫一个选择?如果您给他们所有相同的名称,则它们属于相同的单个选择组.

原文链接:https://www.f2er.com/jquery/531046.html

猜你在找的jQuery相关文章