jquery - jquery中的多种功能切换

Question

我在 jquery 切换函数中看到了多个函数，但我无法理解它们的执行流程。即使jquery中没有任何文档官方网站。

这是函数:-

 $('#menu-toggle').toggle(
    function() {
        console.log('toggle 1 fn');
        $('body').addClass('left-side-collapsed').removeClass('sidebar-colors');
        $('#sidebar .slimScrollDiv').css('overflow', 'initial');
        $('#sidebar .menu-scroll').css('overflow', 'initial');
    }, function() {
        console.log('toggle 2 fn');
        $('body').removeClass('left-side-collapsed')
        $('#sidebar .slimScrollDiv').css('overflow', 'hidden');
        $('#sidebar .menu-scroll').css('overflow', 'hidden');
    }
);

Answer 1

toggle() 方法用于接受多个参数，每个参数都是一个函数，单击元素时将依次执行该函数。

自 jQuery 1.8 起，此模式已被弃用，并且从 1.9 开始，它已从源代码中完全删除。要复制它，您需要检查元素上当前的类并自行切换它，如下所示:

$('#menu-toggle').click(function() {
    if ($('body').hasClass('left-side-collapsed')) {
        $('body').removeClass('left-side-collapsed')
        $('#sidebar .slimScrollDiv, #sidebar .menu-scroll').css('overflow', 'hidden');
    } else {
        $('body').addClass('left-side-collapsed').removeClass('sidebar-colors');
        $('#sidebar .slimScrollDiv, #sidebar .menu-scroll').css('overflow', 'initial');
    }
});

或者，您可以使用 original source code 自行将之前的 toggle() 实现添加回 jQuery 中。 。但请注意，这未经测试且已过时，可能会干扰其他方法，或依赖不再存在的方法。