Javascript 如何从移动响应屏幕中删除悬停功能

当窗口显示正常屏幕时，我正在使用悬停功能

jQuery(".main-menu ul li").hover(
    function() {
        jQuery(this).children("ul").slideToggle(1000);
    }

但我想当屏幕将768px的移动响应这个悬停功能不工作，点击功能将激活。我用过这个函数

    jQuery(window).resize(function() {
        var screenWidth = jQuery(window).width();

        if(screenWidth <= 768){
            jQuery(".main-menu ul li").click(function() {
                jQuery(this).children("ul").slideToggle(1000);
            });

        }
    });

---

但它不起作用

调整窗口大小后重试取消绑定上一次单击事件：

jQuery(window).resize(function() {
    $( ".main-menu ul li").unbind();
    var screenWidth = jQuery(window).width();

    if(screenWidth <= 768){
        jQuery(".main-menu ul li").click(function() {
            jQuery(this).children("ul").slideToggle(1000);
        });

    }
});

---

将鼠标悬停并单击这两个按钮都可以使用此代码。我只想点击功能。当屏幕显示768px时。谢谢。我错过了之前的活动是悬停而不是点击-也许现在就可以了。我删除点击事件表单。取消绑定；现在，您将解除所有事件的绑定-如果这是错误的，请尝试传递“悬停”@musarrof。非常感谢。你是JS的老板。