jQuery: How to select the values from the table's column based on tables header only
I have a table with header ID. I need to select all the fields under this heade开发者_C百科r. I don't have access to the source code and no classes are used in this table. Any idea on how to get this done?
To get the first column:
$(function() {
var col = $("td:nth-child(1)");
});
Most straightforward would be to get the position (index) of the header in the row and then access the value of all cells at the same column index.
$('#table th').click(function() {
var th = $(this);
var index = $('th', th.parents('tr')).index(th);
var column = $('tbody td:nth-child(' + (index + 1) + ')', th.parents('table'));
var values = column.map(function() {
return $(this).text();
});
alert($.makeArray(values));
});
Which is based on this example:
<table id="table">
<thead>
<tr><th>head1</th><th>head2</th><th>head3</th></tr>
</thead>
<tbody>
<tr><td>cell1a</td><td>cell2a</td><td>cell3a</td></tr>
<tr><td>cell1b</td><td>cell2b</td><td>cell3b</td></tr>
<tr><td>cell1c</td><td>cell2c</td><td>cell3c</td></tr>
</tbody>
</table>
You should use the :eq(index) filter.
After having determined the index of the column you want to select (let's call it idx
), you can do:
$('#yourTableID tr').each(function(){
// for each row:
var myField = $(this).children('td:eq('+idx+')');
// do stuff with the selected field
});
精彩评论