OMG I HATE Javascript, JQuery to the Rescue! Thu, 23 Apr 2009 20:22:24 -0400

Okay so as web developers we often run into issues. Okay lets call it like it is, we have to deal with IE. Well today I was working on the dreaded issue with making a menu that will close when you click or focus anywhere else on the page. This one is special because I have a text input field in the menu that is used in conjunction with AJAX to resort/filter the menu items by what is being typed. This would be relatively easy with jquery and an UNDERSTANDING browser.


function openMenu() {
    $('#menu').toggleOn();
    $(document).one('focus', function() {
        $('#menu').toggleOff();
    });
}

See how simple that is? It amazes myself, but that really is all it takes. Then you introduce IE, which only adheres focus to form elements. But aha! I found a way around it, this technique could be duplicated in other frameworks like MooTools, Prototype and plain jane Javascript.


function openMenu() {
    $('#menu').toggleOn();
    $('#menuFilter').one('blur', function() {
        $('#menu').toggleOff(150);
    }
    $('#menuFilter').focus();
}

The 150 timeout on the toggleOff gives time for any events, such as an anchor clicked to process.


Be the first to comment!

Post Comment

  • Disclaimer
  • The ideas and opinions expressed here are mine.
  • I'm a Linux and BSD user, and lean heavily toward the use of OSS vs certain other commercial solutions.

View the Ninja's profile on LinkedIn

:= RSS =: