Ну если бы у вас была задача определить display как block/none, то есть .slideToggle(), но у вас то не block нужно задавать, а table-row-group.
В общем это ведь не сложно, определите .data({mode: 0}) для кнопок, а в обработчике:
$('.trigger').click(function() {
var o = $(this), d = o.data('mode') ^ 1;
o.data({mode: d}).next().css({display: ['none','table-row-group'][d]});
});
и будет то же самое, но с другими стилями.
<style>
.box {
display: none;
width: 50px;
height: 50px;
background: #000;
}
</style>
<button data-mode="0">Show/Hide</button>
<div class="box"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$('[data-mode]').click(function() {
var o = $(this), d = o.data('mode') ^ 1;
o.data({mode: d}).next().css({display: ['none', 'block'][d]})
})
</script>
|