Use jQuery to target the bottom TD in a table column
Ok, so this is the table mar开发者_如何学Gokup:
-------------------------------
heading1 | heading2 | heading3|
-------------------------------
<TABLE CONTENT>
-----------------------------
column1 | column2 | column3 |
-----------------------------
Not great i know but the principle is this: i need to target column1, column2 and column3.
So i can use jQuery to do this: set heading1 as column1's HTML and set heading2 as column2's HTML etc...
But i'm not sure how to relate heading1 to column1 etc...
Thanks
If the number of headings and columns are same, then u may use this:
Assuming headings to be copied are assigned class='source' and target rows (of course first row of column) as class='target'
=>
var dummy=Array(), ctr=0;
dummy=$('.target');
$('.source').each(function()
{
$(dummy[ctr++]).html($(this).html());
}
To do what you want:
$headings = $('#myTable tr:first th');
$('#myTable tr:last th').each(function(i) { $(this).html($headings.eq(i).html()) });
But, actually, for copying header you may simply append it to the bottom of table:
$('#myTable').append($('#myTable tr:first').clone());
The only thing I can add - it would be better to use thead and tfoot for header/footer of table, in this case you will have more comfortable for reading code and easier and faster header/footer row selection.
精彩评论