Question

我一直在研究一段jQuery代码，但我无法按照我想要的方式工作。基本上，我希望完全禁用此jQuery代码低于768px的屏幕宽度。

以下是代码：

$(document).ready(function () {
    $(".resp-menu-btn").click(function () {

        if ($('.resp-menu-btn').is(':animated')) {
            return;
        }

        if ($('.site-nav').css('display') == 'none') {
            $().stop().slideToggle({ "display": "block"}, 600);
            $('.site-nav ').stop().slideToggle(600);
        }

        else {
            $().animate({"display": "none"}, 600);
            $('.site-nav').slideToggle(600);
        }

    });
});

我尝试了几件事：

if(window.innerWidth < 768px) return true;
else return false;

和

if ( $(window).width() > 768) { 
myCode 
}

但似乎没有任何效果。

你们可以给我一些关于如何实现我正在寻找的结果的指示吗？非常感谢！

Answer 1

我不确定你为什么要这样做，但你可以在768px之后取消绑定按钮元素的click事件。

$(window).scroll(onScroll);

function onScroll(){
    if($(window).scrollTop >= 768){
        $(".resp-menu-btn").off('click');
        $(window).off('scroll');
    }
};

如果要将其他函数绑定到此元素，可以将其重新绑定到另一个函数以进行单击事件。

Answer 2

你没有“px”尝试过声明吗？我的意思是你应该像那样使用

 if(window.innerWidth() < 768) return true; else return false;

window.innerWidth属性是只读的。

在某个屏幕宽度禁用jQuery函数

2 个答案: