не может закрыть аккордеон после открытия

108
4

Я не могу закрыть свой аккордеон. Он открывается при нажатии, однако, когда я нажимаю его, он не закрывается.

Вот мой код:

MYPRO.accordion = function () {
var $acpanel = $(".accordion > .accordion-content"),
$acsnav = $(".accordion > .accordion-title > a");

$acpanel.hide().first().slideUp("easeOutExpo");
// $acsnav.first().addClass("active");
$acsnav.on('click', function () {
var $this = $(this).parent().next(".accordion-content");

if ($this.addClass("active")){
$acsnav.removeClass("active");
$acpanel.first($this).slideDown();
$(this).parent().next().slideDown("easeOutExpo");
}
else
{
$acpanel.first($this).slideUp();
$(this).parent().next().slideUp("easeInExpo");
//$acsnav.removeClass('active').slideUp("easeInExpo");
}
return false;
}); }

спросил(а) 2021-01-19T15:35:06+03:00 6 месяцев, 1 неделя назад
1
Решение
109

Каждый раз, когда вы нажимаете, $this.addClass("active") возвращает объект jQuery, поэтому if будет оценивать как true и сдвигать вкладку, никогда не достигая инструкций else.

Попробуйте что-нибудь вроде:

var $acpanel = $(".accordion > .accordion-content"),
$acsnav = $(".accordion > .accordion-title > a");

$acpanel.slideDown("easeOutExpo");
$acsnav.addClass("active");
$acsnav.on('click', function(e) {

if ($acsnav.hasClass("active")) {
$acsnav.removeClass("active");
$acpanel.show().slideUp("easeInExpo");
} else {
$acsnav.addClass("active")
$acpanel.hide().slideDown("easeOutExpo");
}
});

Таким образом, вы сначала проверите, активен ли он. Если это так, сдвиньте и удалите активный класс. Если не активно, сдвиньте вниз и удалите активный класс.

Вот JSFiddle.

Изменить: обновлен код и добавлен JSDFiddle.

ответил(а) 2021-01-19T15:35:06+03:00 6 месяцев, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема