Удалить класс, а затем скрыть его с помощью jquery

Следующий код у меня не похоже на работу.

$("ul li a").live("click", function() {
        $(".myMegaMenuDiv").addClass('hideit').delay(300).removeClass('hideit');
 });

У меня есть мега-меню, поэтому, когда вы наводите курсор мыши на элемент меню, он показывает div ".myMegaMenuDiv". Но когда я нажимаю на ссылку в этом div, я хочу, чтобы она исчезла, как в настоящее время нет. Я надеялся, что приведенный выше код разрешит эту проблему.

"hideit" добавляет значение "display: none"

Это работает, когда у меня просто "addClass", но когда я добавляю "delay" и "removeClass", он перестает работать.

РЕДАКТИРОВАТЬ: Кроме того... после того, как я скрываю ".myMegaMenuDiv", меню не отображается, когда я наводю курсор мыши на элемент навигационного меню, поэтому необходимо удалить класс тоже

3 ответа

Решение

Если вы просто хотите скрыть div на клике, вы можете просто использовать hide функция. Так же live функция устарела, поэтому лучше использовать on,

$("ul li a").on("click", function() {
    $(".myMegaMenuDiv").hide();
});

Если вы хотите скрыть и показать, вы можете использовать setTimeout:

$("ul li a").on("click", function() {
    $(".myMegaMenuDiv").hide();
    setTimeout(function() {
        $(".myMegaMenuDiv").show();
    }, 300);
});

.hide() а также .show() методы могут получить число для определения их продолжительности, поэтому вы можете попробовать это вместо:

$(".myMegaMenuDiv").hide(300).show(0);

Если вы не хотите анимацию, вы можете сделать это так:

$('.myMegaMenuDiv').hide(0).delay(300).show(0)

delay это не просто таймер паузы. это относится только к элементам в очереди анимации. Вам нужно использовать setTimeout

http://api.jquery.com/delay/

Другие вопросы по тегам