<table> <tr><td>title 1</td></tr> <tr class="hidcont"><td>content 1</td></tr> <tr><td>title 2</td></tr> <tr class="hidcont"><td>content 2</td></tr> <tr><td>title 3</td></tr> <tr class="hidcont"><td>content 3</td></tr> </table>
Nothing special, a label like a label, jQuery
script:
$('tr').click(function(){ var hidcont = $(this).next('tr'); if (hidcont.hasClass('hidcont')){ $('.hidcont').hide(); $(this).next('tr').toggle(); } });
Opens / Hides blocks. Nothing like that either. And the problem is the following: I want to make it so that when you click on tr
current open block with content is hidden / opened, but now it turns out that the hidden element is tight and as a result the current block with content remains visible.
In general, all this is better to see 1 time than to hear one time
upd (solution)
$('tr').click(function(){ if ($(this).hasClass('active')) { $('.hidcont').hide(); $(this).removeClass('active'); } else { $('.active').next('.hidcont').hide(); $('.active').removeClass('active'); $(this).addClass('active'); $(this).next('.hidcont').show(); } });