Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 鼠标悬停在wordpress菜单中单击_Javascript_Jquery_Wordpress_Navigationbar - Fatal编程技术网

Javascript 鼠标悬停在wordpress菜单中单击

Javascript 鼠标悬停在wordpress菜单中单击,javascript,jquery,wordpress,navigationbar,Javascript,Jquery,Wordpress,Navigationbar,我使用了一个主题,我将其更改为水平显示子菜单,现在我想在单击时显示子菜单,而不是悬停,我不擅长javascript,但我认为这段代码是关于导航菜单的: var nav = { init: function() { // Add parent class to items with sub-menus jQuery("ul.sub-menu").parent().addClass('parent'); var menuTop = 40;

我使用了一个主题,我将其更改为水平显示子菜单,现在我想在单击时显示子菜单,而不是悬停,我不擅长javascript,但我认为这段代码是关于导航菜单的:

var nav = {
    init: function() {

        // Add parent class to items with sub-menus
        jQuery("ul.sub-menu").parent().addClass('parent');

        var menuTop = 40;
        var menuTopReset = 80;

        // Enable hover dropdowns for window size above tablet width
        jQuery("nav").find(".menu li.parent").hoverIntent({
            over: function() {
                if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {

                    // Setup menuLeft variable, with main menu value
                    var subMenuWidth = jQuery(this).find('ul.sub-menu').first().outerWidth(true);
                    var mainMenuItemWidth = jQuery(this).outerWidth(true);
                    var menuLeft = '-' + (Math.round(subMenuWidth / 2) - Math.round(mainMenuItemWidth / 2)) + 'px';
                    var menuContainer = jQuery(this).parent().parent();

                    // Check if this is the top bar menu                            
                    if (menuContainer.hasClass("top-menu")) {
                        if (menuContainer.parent().parent().parent().hasClass("top-bar-menu-right")) {
                        menuLeft = "";
                        } else {
                        menuLeft = "-1px";
                        }
                        menuTop = 30;
                        menuTopReset = 40;
                    } else if (menuContainer.hasClass("header-menu")) {
                        menuLeft = "-1px";
                        menuTop = 28;
                        menuTopReset = 40;
                    } else if (menuContainer.hasClass("mini-menu") || menuContainer.parent().hasClass("mini-menu")) {
                        menuTop = 40;
                        menuTopReset = 58;
                    } else {
                        menuTop = 44;
                        menuTopReset = 64;
                    }

                    // Check if second level dropdown
                    if (jQuery(this).find('ul.sub-menu').first().parent().parent().hasClass("sub-menu")) {
                        menuLeft = jQuery(this).find('ul.sub-menu').first().parent().parent().outerWidth(true) - 2;
                    }

                    jQuery(this).find('ul.sub-menu').first().addClass('show-dropdown').css('top', menuTop);
                }
            },
            out:function() {
                if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
                    jQuery(this).find('ul.sub-menu').first().removeClass('show-dropdown').css('top', menuTopReset);
                }
            }
        });

        jQuery(".shopping-bag-item").live("mouseenter", function() {

            var subMenuTop = 44;

            if (jQuery(this).parent().parent().hasClass("mini-menu")) {
                subMenuTop = 40;
            }

            jQuery(this).find('ul.sub-menu').first().addClass('show-dropdown').css('top', subMenuTop);
        }).live("mouseleave", function() {
            if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
                jQuery(this).find('ul.sub-menu').first().removeClass('show-dropdown').css('top', 64);
            }
        });

        // Toggle Mobile Nav show/hide          
        jQuery('a.show-main-nav').on('click', function(e) {
            e.preventDefault();
            if (jQuery('#main-navigation').is(':visible')) {
            jQuery('.header-overlay .header-wrap').css('position', '');
            } else {
            jQuery('.header-overlay .header-wrap').css('position', 'relative');
            }
            jQuery('#main-navigation').toggle();
        });

        jQuery(window).smartresize(function(){  
            if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
                var menus = jQuery('nav').find('ul.menu');
                menus.each(function() {
                    jQuery(this).css("display", "");
                });
            }
        });

        // Set current language to top bar item
        var currentLanguage = jQuery('li.aux-languages').find('.current-language span').text();
        if (currentLanguage !== "") {
            jQuery('li.aux-languages > a').text(currentLanguage);
        }

    },
    hideNav: function(subnav) {
        setTimeout(function() {
            if (subnav.css("opacity") === "0") {
                subnav.css("display", "none");
            }
        }, 300);
    }
};

我试图用“单击”来代替“hoverIntent”,但它不起作用,我能做什么?

当有人当前悬停时会发生什么,它在悬停时做一件事,当他们离开时,它必须进行一种
清理
,这是
hoverIntent
中的两个功能,即
over
out
,因此需要将代码分成两个事件侦听器,一个用于元素的
单击
,另一个用于
模糊

我已经将这两个侦听器链接到初始选择器,所以它应该都能工作

    var nav = {
        init: function() {

            // Add parent class to items with sub-menus
            jQuery("ul.sub-menu").parent().addClass('parent');

            var menuTop = 40;
            var menuTopReset = 80;

            // Enable click dropdowns for window size above tablet width
jQuery("nav").find(".menu li.parent").on('click', function (event) {
    if($(event.target).parent().hasClass('menu-item-has-children')){
     event.preventDefault();
    };
    if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
        // Setup menuLeft variable, with main menu value
        var subMenuWidth = jQuery(this).find('ul.sub-menu').first().outerWidth(true);
        var mainMenuItemWidth = jQuery(this).outerWidth(true);
        var menuLeft = '-' + (Math.round(subMenuWidth / 2) - Math.round(mainMenuItemWidth / 2)) + 'px';
        var menuContainer = jQuery(this).parent().parent();

        // Check if this is the top bar menu                            
        if (menuContainer.hasClass("top-menu")) {
            if (menuContainer.parent().parent().parent().hasClass("top-bar-menu-right")) {
                menuLeft = "";
            } else {
                menuLeft = "-1px";
            }
            menuTop = 30;
            menuTopReset = 40;
        } else if (menuContainer.hasClass("header-menu")) {
            menuLeft = "-1px";
            menuTop = 28;
            menuTopReset = 40;
        } else if (menuContainer.hasClass("mini-menu") || menuContainer.parent().hasClass("mini-menu")) {
            menuTop = 40;
            menuTopReset = 58;
        } else {
            menuTop = 44;
            menuTopReset = 64;
        }

        // Check if second level dropdown
        if (jQuery(this).find('ul.sub-menu').first().parent().parent().hasClass("sub-menu")) {
            menuLeft = jQuery(this).find('ul.sub-menu').first().parent().parent().outerWidth(true) - 2;
        }

        jQuery(this).find('ul.sub-menu').first().addClass('show-dropdown').css('top', menuTop);
    }
}).on('mouseleave',function () {
    if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
        jQuery(this).find('ul.sub-menu').first().removeClass('show-dropdown').css('top', menuTopReset);
    }
});     
            // Toggle Mobile Nav show/hide          
            jQuery('a.show-main-nav').on('click', function(e) {
                e.preventDefault();
                if (jQuery('#main-navigation').is(':visible')) {
                jQuery('.header-overlay .header-wrap').css('position', '');
                } else {
                jQuery('.header-overlay .header-wrap').css('position', 'relative');
                }
                jQuery('#main-navigation').toggle();
            });

            jQuery(window).smartresize(function(){  
                if (jQuery('#container').width() > 767 || jQuery('body').hasClass('responsive-fixed')) {
                    var menus = jQuery('nav').find('ul.menu');
                    menus.each(function() {
                        jQuery(this).css("display", "");
                    });
                }
            });

            // Set current language to top bar item
            var currentLanguage = jQuery('li.aux-languages').find('.current-language span').text();
            if (currentLanguage !== "") {
                jQuery('li.aux-languages > a').text(currentLanguage);
            }

        },
        hideNav: function(subnav) {
            setTimeout(function() {
                if (subnav.css("opacity") === "0") {
                    subnav.css("display", "none");
                }
            }, 300);
        }
    };

这似乎太复杂了。你有到实时版本的链接吗

通常,当使用可单击的父菜单执行单击查看子菜单时,我会设置一个变量以查看菜单是否打开,如果没有,请不要转到链接。如果是,请转到链接

例如:


根据你的菜单,你可以用类似的东西。但是它在菜单中使用了大量的代码。

请阅读并仅在您有问题的地方发布代码。我猜您没有想到父按钮给您带来的链接?!哈弗在那里可能是有很好的理由的!也许您可以去掉父级上的
标记,然后它就可以工作了。此外,当我在您的代理上这样做时,“blur”函数不会关闭菜单(我们必须使用另一个事件)。也许你可以设置一个jsfiddle.net,我们可以提供更多帮助。没有办法不去链接页面就保留标签吗?是的,很好。尝试更新代码。(很抱歉,更新后没有在更早的时候发布此评论)Fiddle也没有按预期工作。谢谢,现在您最好能看到菜单显示而不去链接,但现在无法单击子菜单
    var $handle = $('.sub-menu').prev();

    var opened = 0;
    $handle.on('click', function(e){

      if (opened) {
        window.location.href = $(this).attr('href');
      } else {
        e.preventDefault();
        e.stopPropagation();
        $('.sub-menu').slideToggle();
        opened = 1;
      }
    });

    $('html').on('click', function(){
      if (opened) {
        $('.sub-menu').slideToggle();
        opened = 0;
      }
    });