我有一个表(id =“docsTable”),其行类似于:
<tr bgcolor="#E7DDCC">
<td align="center"><input type="checkbox" name="docsToAddToClass[]" value="35" /></td>
<td>Document Title</td>
<td>Document Description.</td>
</tr>
我需要遍历表格,确定用户选中了哪些复选框,对于带有复选框的行,请抓取第一个的值和下两个的文本。
我不需要构建集合:在每次迭代中,我想在其他地方更改某些元素。这不是困难的部分(对我来说)。它试图弄清楚如何遍历表格并仅选中带有选中复选框的s。
答案 0 :(得分:8)
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script>
<script type="text/javascript">
$(function(){
$('#btnTest').click(function(){
$('#docsTable input[type="checkbox"]:checked').each(function(){
var $row = $(this).parents('tr');
alert($row.find('td:eq(0) input').val());
alert($row.find('td:eq(1)').html());
alert($row.find('td:eq(2)').html());
});
});
});
</script>
</head>
<body>
<table id="docsTable">
<tr bgcolor="#E7DDCC">
<td align="center"><input type="checkbox" name="docsToAddToClass[]" value="35" /></td>
<td>Document Title 1</td>
<td>Document Description.</td>
</tr>
<tr bgcolor="#E7DDCC">
<td align="center"><input type="checkbox" name="docsToAddToClass[]" value="36" /></td>
<td>Document Title 2</td>
<td>Document Description.</td>
</tr>
<tr bgcolor="#E7DDCC">
<td align="center"><input type="checkbox" name="docsToAddToClass[]" value="37" /></td>
<td>Document Title 3</td>
<td>Document Description.</td>
</tr>
</table>
<input type='button' id='btnTest' value='Get Rows' />
</body>
</html>
答案 1 :(得分:2)
您可以尝试这一行:
$('tr > td:first-child > input:checked').each(function() {
// $(this).val() is the value of the input
// $(this).parent().siblings() will refer to the two <td>'s
// You can also try other traversal methods like $(this).parent().next()
});
希望这有效并且有所帮助!
答案 2 :(得分:2)
$('#docsTable > tr > td > input:checked').each(function(i,element){
var el = $(element);
alert( el.val() );
alert( el.parent().siblings(':eq(0)').html() );
alert( el.parent().siblings(':eq(1)').html() );
});