单击移动设备的 Jquery 触发器，将鼠标悬停在桌面上

Question

虽然我已经看过很多次这个问题，但我真的找不到答案。基本上我有一个下拉菜单，我正在尝试添加事件，以便它在桌面上悬停并在移动设备上单击时打开。

我尝试使用此代码，但在我调整窗口大小时它以某种方式工作(它不会立即检查，但如果我调整窗口大小时它会检查，这在某种程度上显然与给定的代码有关，但我如何编辑它) .

    $(window).on('resize', function(event){
    var windowSize = $(window).width(); // Could've done $(this).width()
    if(windowSize < 300){
        $('.menu-button').addClass('bbb');
    } else if(windowSize < 768){
        $('.dd-mlink').click(function() {
            $(this).toggleClass('show');
            $('.dd-nav').toggleClass('dd-nav-full');
            $('.dd-menu').toggleClass('dd-menu-full');
        });
    } else {
        $('.dd-mlink').hover(function() {
            $(this).toggleClass('show');
            $('.dd-nav').toggleClass('dd-nav-full');
            $('.dd-menu').toggleClass('dd-menu-full');
        });
    }
});

.dd-mlink 是我的触发器，它是一个垂直的全宽下拉菜单，所以我需要更多的 toggleClasses。

还有其他选择吗？更高效？有什么图书馆可以帮我完成这项工作吗？

我尝试了很多方法，包括创建一个 div，为不同的尺寸添加不同的属性(使用媒体查询)，以及检查这些属性，但它不起作用。任何帮助将非常感激。干杯!

Answer 1

我实际上是通过在那个窗口函数的调整大小旁边添加加载来解决这个问题的，就像这样

$(window).on('load resize', function(event){

这是代码，如果有人会用的话

$(window).on('load resize', function(event){
    var windowSize = $(window).width(); // Could've done $(this).width()
    if(windowSize < 992){
        // your check here
    } else if(windowSize > 994){
        // other statements
    } 
});

您可以添加任意数量的其他内容。干杯。祝你好运