jquery - 如何使用 jQuery 切换侧边栏 div

Question

我和这个问题完全相同： How to toggle (hide / show) sidebar div using jQuery

不幸的是，这不再适用于 jQuery 1.9.1。如何使用最新版本的 jQuery 获得相同的结果？

Answer 1

尽管 jQuery toggle()、slideToggle()和fadeToggle()是最常用的工具，但使用toggleClass()增加了更多的灵活性，因为您可以在 CSS 中设置样式/动画并将其与 JS 代码分开。例如

.item {
    width: 100px;
    height: 100px;
    background: red;
    -webkit-transition: width 1s;
    -moz-transition: width 1s;
    -ms-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s;
}
.item.hidden {
    width: 0;
}

接着：

$('.item').toggleClass('hidden');

演示

Answer 2

试试这个

$('button').click(function(){
     $('#My_div_id').toggle();
});

Answer 3

为该元素制作 id 选择器，然后为作为“处理器”的元素制作 id 以进行操作。

例如：

$('#id1').click(function(){
$('#id2').slideToggle(x);
});

其中，x 是一秒的数字 (1000)。它也可以是单词，慢，快。

Answer 4

尝试：

(function() {
    var state = 0;
    var toggle = function() {
        if (state === 0) {
            $('#B').css('left', '0');
            state = 1;
        } else {
            $('#B').css('left', '200px');
            state = 0;
        }
    }

    $('button').click(toggle);
}());