Mootools: как остановить событие, когда происходит другое событие - PullRequest
Новая
       29

Mootools: как остановить событие, когда происходит другое событие

1 голос
/ 05 апреля 2011

У меня есть вопрос об обработке событий mootools.

Я хочу отложить событие ввода мыши для выпадающего меню.Через 1 секунду список раскрытия будет отображаться как "setStyle ('display', 'block') ... это то, что я получил, и это работает: 

$('main-nav').getElements('li.level-1 ul.quick-nav').setStyle('display', 'none');

                            $('main-nav').getElements('li.level-1').each(function(elem){
                               var list = elem.getElement('.quick-nav');

                                elem.addEvents({
                                    'mouseenter' : function(event){                                                                                     
                                        (function() {
                                            elem.getElement('.quick-nav').setStyle('display', 'block');
                                        }).delay(1000)},
                                    'mouseleave' : function(event){                                               
                                            elem.getElement('.quick-nav').setStyle('display', 'none');
                                        }
                                });
                            });

I«Задержал событие mouseenter с помощью функции delay ... проблема, которую я получил и до сих пор не могу решить, состоит в том, что событие mouseenter будет происходить, когда я уже покинул свой элемент навигации. Я вхожу в элемент, немедленно покидаю элемент ичерез одну секунду подэлемент все еще появляется. Поэтому мне нужна какая-то проверка в событии mouseleave, если мой пункт меню уже отображается или нет. Тогда я мог бы остановить событие mouseenter, если элемент меню все еще не виден ... Я неНе знаю, как я могу ответить на событие mousenter из функции события mouseleave ... надеюсь, кто-нибудь это понял ...

Заранее спасибо.

1 Ответ

2 голосов
/ 05 апреля 2011

использовать таймер и clearTimeout при отпускании мыши (также $clear(timer) в старых версиях mootools). 

$('main-nav').getElements('li.level-1 ul.quick-nav').setStyle('display', 'none');

$('main-nav').getElements('li.level-1').each(function(elem) {
    var list = elem.getElement('.quick-nav');
    var timer;
    elem.addEvents({
        'mouseenter': function(event) {
            timer = (function() {
                elem.getElement('.quick-nav').setStyle('display', 'block');
            }).delay(1000)
        },
        'mouseleave': function(event) {
            clearTimeout(timer);
            elem.getElement('.quick-nav').setStyle('display', 'none');
        }
    });
});
...