主页 / coding / 问题 / 79526856
Accepted
dung nguyen
Asked: 2025-03-22 10:23:22 +0800 CST

Jquery 点击事件在移动浏览器和 Google Chrome 中不起作用

  • 772

我有一些 jQuery 代码来处理移动设备的下拉菜单。它在 Firefox 上运行良好，但在 Chrome 和移动设备上却不行。

我的网站是https://excelwebdesign.ie，代码已经监听了，但是不起作用，没有任何错误。我不知道为什么。看我的截图。

在此处输入图片描述

这是我的代码：

jQuery(document).ready(function(){
        jQuery(".menu-toggle").click(function(){
            if(jQuery(this).hasClass("open")){
                jQuery(this).removeClass("open");
                jQuery("body").removeClass("navigation-open");
                
                jQuery("#menu-main-menu-mobile").children("li").hide();
            }else{
                jQuery(this).addClass("open");
                jQuery("body").addClass("navigation-open");
                
                jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
                    jQuery(this).delay(100 * i).fadeIn(500);
                });
            }
        });
        
        jQuery("#menu-main-menu-mobile").children("li.menu-item-has-children").each(function(){
            var thismn = jQuery(this);
            
            thismn.children("a").on("click", function(e){
                e.preventDefault();

                jQuery("#navigation").find(".sub-menu.open").removeClass("open");
                thismn.children(".sub-menu").addClass("open");
                jQuery(".scwmobilemenu_head").html('<i class="fa fa-chevron-left"></i> Back');
                
                thismn.parent("ul").addClass("opensubmenu opensubmenu_level1");
                
                jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
                    jQuery(this).children("a").delay(100 * i).animate({
                        left: -50,
                        opacity: 0
                    }, 500);
                });
                thismn.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) {
                    jQuery(this).delay(200 * i).fadeIn(1000);
                });
            });
            
            thismn.find("li.menu-item-has-children").each(function(){
                var thismnlv2 = jQuery(this);
                
                thismnlv2.children("a").click(function(e){
                    e.preventDefault();
                    
                    thismnlv2.children(".sub-menu").addClass("open");
                    thismnlv2.parent("ul").addClass("opensubmenu opensubmenu_level2");
                    
                    jQuery(".opensubmenu_level2").children("li").each(function(i) {
                        jQuery(this).children("a").delay(100 * i).animate({
                            left: -50,
                            opacity: 0
                        }, 500);
                    });
                    thismnlv2.children(".sub-menu").children("li:not(.menu-item-object-ubermenu-custom)").each(function(i) {
                        jQuery(this).delay(200 * i).fadeIn(1000);
                    });
                });
            });
        });
        
        jQuery(".scwmobilemenu_head").click(function(){
            if(jQuery(".opensubmenu").length > 1){
                jQuery(".opensubmenu_level2").find(".sub-menu.open").children("li").fadeOut();
                jQuery(".opensubmenu_level2").children("li").each(function(i) {
                    jQuery(this).children("a").delay(100 * i).animate({
                        left: 0,
                        opacity: 1
                    }, 500);
                });
                
                jQuery(".opensubmenu_level2").find(".sub-menu.open").removeClass("open");
                jQuery(".opensubmenu_level2").removeClass("opensubmenu").removeClass("opensubmenu_level2");
            }else{
                jQuery(".opensubmenu_level1").find(".sub-menu.open").children("li").fadeOut();
                jQuery("#menu-main-menu-mobile").children("li").each(function(i) {
                    jQuery(this).children("a").delay(100 * i).animate({
                        left: 0,
                        opacity: 1
                    }, 500);
                });
                
                jQuery(".opensubmenu_level1").find(".sub-menu.open").removeClass("open");
                jQuery(".opensubmenu_level1").removeClass("open").removeClass("opensubmenu").removeClass("opensubmenu_level1");
                jQuery(this).html('Menu');
            }
        });
    });

请帮忙，谢谢

jquery

1 个回答

  1. Best Answer

    您应该使用触摸事件，因为点击事件在触摸时不可靠。我使用触摸结束：

    if (isMobile)
    clickEvent = “touchend”;
else
    clickEvent = “click”;

$(‘#foo’).on(clickEvent, function(e){
    // do something here
});
    • 0

相关问题