Stop the hiding event

Question

I have a Superfish menu item that has 2 text inputs, I want to make sure the menu does not get closed (hidden) if one of these fields has the user's focus.

I have everything for this except I don't know how to stop the Superfish Hide event execution.

    jQuery(function () {
        jQuery('ul.sf-menu').superfish({
            onBeforeHide: function () {
                $('ul.sf-menu').find('input[type=text], input[type=password]').each(function () {
                    if ($(this).is(':focus')) {
                        //need code to stop Superfish Hide execution here
                    }
                });
            },
            delay: 500
        });
    });

How can I stop the hide event execution?

Answer 1

Well, this is fixed. I had to change the plugin code itself:

if ($ul.find('input[type=text]:focus, input[type=password]:focus ').length  == 0){

     $ul.stop(true, true).animate(o.animationOut, speed, function () {
     var $this = $(this);                        
     o.onHide.call($this);                        
             });
     }
 else{
      $(this).addClass(o.hoverClass);
     }

The idea is to count a number of text inputs that have user's focus at the moment, if there's more than one, add the hoverClass which makes the menu item stay visible. If there's no focused items, it will proceed with hiding as usual.

Answer 2

Do you need something like event.PreventDefault()? http://api.jquery.com/event.preventDefault/

Or if that's not man enough for the job a return false; should stop everything in its tracks.

[edit] You could try doing a .stop() on the animations for the element

jQuery(function () {
    jQuery('ul.sf-menu').superfish({
        onBeforeHide: function (liElement) {
            $('ul.sf-menu').find('input[type=text], input[type=password]').each(function () {
                if ($(this).is(':focus')) {
                    $(liElement).stop();
                }
            });
        },
        delay: 500
    });
});

Or if that doesn't help you may have to cancel the mouseleave event that the menu registers for its li elements. Excuse the pseudocode in the if

$("ul.sf-menu").on("mouseleave", "li:having(ul)", function(){
        $(this).find('input[type=text], input[type=password]').each(function () {
            if ($(this).is(':focus')) {
                event.preventDefault();
            }
        });
});

Answer 3

I had the same need with superfish 1.7.4. Here is my solution, tested with Chrome 31, IE 10 and IE 10 Compatibility mode IE 7 :

 /*to store the input which gets the focus (mouse click or tab key)*/
    var inputFocused = null;
    $('#mymenu').superfish({
    delay: 500
    , speed: 'fast'
    , disableHI: true
    , onInit: function(){
        var ul = $(this);
        var inputs = ul.find('input[type=text], input[type=password]');
        inputs.each(function(index, elt){
        $(elt).on('click', function(event){
            inputFocused = $(elt);
            event.stopPropagation();
        });
        $(document).on('click', function(event){
                            /*to allow people to choose to quit the menu*/
            inputFocused = null;
        });
        $(elt).on('keyup', function(event){
            inputFocused = $(elt);
            event.stopPropagation();
        });
    });
}
, onHide: function(){
var ul = $(this);
if(inputFocused != null && ul.find(inputFocused).length > 0){
    ul.css('display', 'block');
    inputFocused.focus();
}
}
});