Как отменить привязку / остановку события onMouseOut, если поля формы имеют фокус, в плагине hoverIntent jQuery? - PullRequest
1 голос
/ 23 ноября 2011

Я использую плагин jQuery hoverIntent , чтобы расширить / сократить div, в котором есть форма.Как вы можете видеть ниже, форма показывается, когда div высокий.

Как я могу предотвратить запуск onMouseOut / makeShort, если какое-либо из полей формы имеет фокус?

$(document).ready(function(){

    var config = {    
         over: makeTall, // function = onMouseOver callback (REQUIRED)    
         timeout: 650, // number = milliseconds delay before onMouseOut    
         out: makeShort // function = onMouseOut callback (REQUIRED)   
    };

    $("#mydiv").hoverIntent( config );

    function makeTall(){ 
            $(this).css({"height":100});
            $("#myForm").show('fast');
    }

    function makeShort(){
            $("#myForm").hide('fast');
            $(this).css({"height":50});
    }

});

Я также открыт для предложения, если есть другой более надежный плагин для событий при наведении.

Ответы [ 2 ]

1 голос
/ 23 ноября 2011

Просто проверьте наличие активных элементов:

function makeTall(){ 
    $(this).css({"height":100});
    $("#myForm").show('fast');
}

function makeShort(){
    if (!$("#myForm").find(':focus').length) {
        $("#myForm").hide('fast');
        $(this).css({"height":50});
    }
}
0 голосов
/ 23 ноября 2011

Почему бы не использовать методы jQuery mouseleave и mouseenter .

Событие mouseleave отличается от mouseout тем, как оно обрабатывает всплывающее событие.Если в этом примере использовались указатели мыши, то при перемещении указателя мыши из элемента «Внутренний» обработчик срабатывает.Это обычно нежелательное поведение.Событие mouseleave, с другой стороны, запускает свой обработчик только тогда, когда мышь покидает элемент, с которым она связана, а не потомок.Таким образом, в этом примере обработчик срабатывает, когда мышь покидает внешний элемент, но не внутренний элемент.

Пример: http://jsfiddle.net/TeYNw/2/

...