Question

我正在使用Sidr插件在移动设备上查看时向我的网站添加侧边菜单。当用户单击其中一个侧面菜单项时，我希望关闭菜单，然后将其设置为所选项目的动画。基本上它是一个美化的内部链接菜单，带有大量带有ID的内容的哈希链接。

以下是我目前用于此目的的代码：

    $(".mobile-nav button").sidr({source: ".sidr" });
    $('.sidr nav ul').on('click', 'li a[href^="#"]', function(){
        $(".mobile-nav button").click();
        var target = this.hash;
        var $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });

        return false;
    });

在桌面浏览器上以400px宽度查看时，此功能正常。但是当在实际的移动设备上查看时，有效关闭Sidr菜单的.click（）不起作用。

我相信这是因为你无法点击＆＃34;在手机上，但任何人都可以想到我如何解决这个问题？任何帮助都会很棒。

由于

Answer 1

使用click touchstart：

$('.sidr nav ul').on('click touchstart', 'li a[href^="#"]', function(){
//rest of your code
}

Answer 2

我在移动设备上遇到了与sidr类似的问题。最后，我用了

$.sidr("toggle","sidr-0");

而不是

$( "#sidr-0" ).trigger( "click" );

它有效。这显然与移动设备上的文档准备和移动浏览器使用ajax页面加载有关，导致click（）提前触发。我希望这会有所帮助。

使用JQuery在移动设备上触发单击事件

2 个答案: