Как показать скрытый столбец при нажатии кнопки

Question

Как показать скрытый столбец при нажатии кнопки

0

У меня есть таблица, и мне нужно скрыть/показать столбец таблицы, когда щелкните заголовок столбца, который столбец будет скрыт, и появится кнопка. Когда я нажимаю кнопку, я хочу показать скрытую coloumn. Как я могу это сделать? см. мой код здесь http://jsfiddle.net/9QkVd/29/.

благодаря

$(function() {
    $('table tbody tr:odd').addClass('alt');

    $('table tbody tr').hover(function() {
        $(this).addClass('hover');
    }, function() {
        $(this).removeClass('hover');
    });
});

$('tr th:gt(0)').click(function() {

    var index = (this.cellIndex + 1);
    var cells = $('table tr > :nth-child(' + index + ')');
    cells.toggleClass('hide');

    if ($(this).hasClass('hide')) {
        $(this).find('span').html('<b>+</b>');
    }
    else {
        $(this).find('span').html('<b>-</b>');
    }

    if ($('table tr > th:not(.hide)').length)
        $('table').removeClass('hide');
    else
        $('table').addClass('hide');
     $('.btnAssociate').show();
});

 $('.btnAssociate').click(function()
    {


         $('.btnAssociate').hide();

    });

Xavi 13 дек. 2013, в 14:34

Источник

Теги:

javascript

jquery

html

button

show-hide

2 ответа

1

Вот отличный способ сделать это, вы можете скрывать столбцы и возвращать их по порядку последнего кликаемого элемента.

В основном добавьте массив для хранения значений индекса столбца, на который вы нажимаете:

var indexVal = [];

И затем на кнопку щелчка кнопки вы пишете:

var cells = $('table tr > :nth-child(' + indexVal[indexVal.length-1] + ')');
cells.toggleClass('hide');
indexVal.pop();
if (!indexVal) $('.btnAssociate').hide();

C. S. 13 дек. 2013, в 09:58

Ещё вопросы

Rohan Kumar · Accepted Answer · 2013-12-13T10-13-00.000Z

Попробуй это,

$('.btnAssociate').click(function () {
    $('table th,table td').removeClass('hide');
    $('.btnAssociate').hide();
});

демонстрация