Раскрывающееся меню jQuery ведет себя по-разному в IE и Webkit - PullRequest
1 голос
/ 24 августа 2011

Требуемое поведение:

  • щелкните родительский элемент, чтобы открыть раскрывающееся меню
  • щелкните в любом месте страницы или родительского элемента, чтобы закрыть раскрывающееся меню

Мой код jQuery прекрасно работает в Safari и Firefox, но не в IE 8. В IE 8 раскрывающееся меню открывается и закрывается снова при первом щелчке по родительскому элементу.При втором щелчке по родительскому элементу раскрывающееся меню остается открытым.Я использую jQuery 1.6.2.

Вот код jQuery (немного Франкенштейна, который я собрал из различных методов, о которых я читал):

$(function() {
/* for keeping track of what's "open" */
    var activeClass = 'menu-open', showingDropdown, showingMenu, showingParent;
    /* hides the current menu */
    var hideMenu = function() {
        if(showingDropdown) {
            showingDropdown.removeClass(activeClass);
            showingMenu.fadeOut(500);
        }
    };

    /* recurse through dropdown menus */
    $('.drop').each(function() {
        /* track elements: menu, parent */
        var dropdown = $(this);
        var menu = dropdown.next('.subnav'), parent = dropdown.parent();
        /* function that shows THIS menu */
        var showMenu = function() {
            hideMenu();
            showingDropdown = dropdown.addClass('menu-open');
            showingMenu = menu.show();
            showingParent = parent;
        };
        /* function to show menu when clicked */
        dropdown.attr('href','/#dropdown').bind('click',function(e) {
            if(e) e.stopPropagation();
            if(e) e.preventDefault();
            if ( dropdown.hasClass('menu-open') ) {
                hideMenu();
            } else {
                showMenu();
            }
        });
        /* function to show menu when someone tabs to the box */
        dropdown.bind('focus',function() {
            showMenu();
        });

    });
});

Это было бы очень полезноесли бы кто-нибудь мог дать мне указание на то, почему IE будет вести себя иначе, чем Webkit и Firefox.Ссылка на существующее решение, которое делает то, что я описываю, также была бы отличной.Пожалуйста, объясните, как если бы вы разговаривали с медленным ребенком, потому что jQuery / Javascript не моя сильная сторона.

1 Ответ

0 голосов
/ 24 августа 2011

showMenu ();вызывается по фокусу (мышь вниз), затем по «щелчку» (отпускание мыши) hideMenu ();вызывается, поэтому, если вы нажмете на него снова, он работает, потому что он уже сфокусирован.но если бы вы кликнули на нее, держу пари, вы бы поступили так же. Я бы убрал код «focus» imo или сделал «focus», чтобы он не мешал «click»

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...