Как закрыть все toggle кроме одного?

Question

[Демид Бородин]

Есть таблица, в ней постоянно дублируются вот такой кусок кода.

<table>
    <tbody>
        <td class="click">какой-то контент</td>
        <td class="description"> какой-то контент </td>

        <td class="click">какой-то контент</td>
        <td class="description"> какой-то контент </td>

         <td class="click">какой-то контент</td>
        <td class="description"> какой-то контент </td>
    </tbody>
</table>

Есть вот такой скрипт

$('table tbody tr.click').click(
    function () {
        $('.description').hide();
        $(this).addClass('open').next('.description').show();
    }
);

Сейчас это работает так.

Нажимаем на td.click - все td.description закрываются - next td.description открывается.
Мне нужно реализовать закрытие td.description по клику на td.click который его открыл (! и он не должен открыться снова !)

Пытался решить задачу добавлением класса к td.click но что-то идет не так, решил вернутся к исходному скрипту и спросить тут.

Answer 1

[Владислав Козуля]

Брр. Из описания сложно понять, что вообще происходит и что нужно сделать, но я попытаюсь.

Если я правильно угадал, нужно сделать следующее:

$('table tbody tr.click').click(
  function () {
    var next = $(this).addClass('open').next('.description'),
        shown = (next).is('visible');

    $('.description').hide();

    if (!shown) {
      next.show(); // показать, если элемент скрыт
    }
  }
);

Comments

[Демид Бородин]

Владислав Козуля Это не работает, хотя бы потому, что в последней строчке вы скрываете абсолютно все description.

[Демид Бородин]

Владислав Козуля Всё равно большое спасибо, вы натолкнули меня на правильное решение.

[Владислав Козуля]

Демид Бородин: я немного подправил, теперь должно быть правильно (:

[Демид Бородин]

Владислав Козуля: да, так работает. Ниже я выложил свой рабочий пример кода, но ваш пример кажется более "человечным" :)

[Демид Бородин]

Хотя нет, не пашет, мой вариант работает. Смысл всего скрипта в том, что бы .description можно было закрыть повторным нажатием на .click, а при нажатии на какой ни будь другой .click все .description закрывались и открывался нужный. В общем я сейчас залил свой вариант, можете глянуть тут new.repair24.pro клацнуть нужно по "ремонт планшетов" и клацнуть по любому пункту таблицы.

Answer 2

[Демид Бородин]

$('table tbody tr.click').click(
    function () {
        var next = $(this).addClass('open').next('.description');
        if (!(next).is(':visible')) {
            $('.description').hide();
            next.show(); // показать, если элемент скрыт
        } else {
            next.hide();
        }
    }
);

Answer 3

[Александр Аксентьев]

используйте toggle, а не show/hide

Comments

[Демид Бородин]

Ну, можно конечно проверять состояние toggle на true или false, но c show и hide всё более однозначно. Вопрос уже решен.