jquery升级后toggle的一个feature失效的fix

jquery升级到1.9x后，它的toggle方法只剩下了显示/隐藏一个特性。1.9-的引申含义"两个function轮流执行"这个feature被干掉了。按照官方说法是"提高模块化"之类，对个人就只剩下"我勒个擦怎么主题变丑啦"之类的效果。原本在单个post的右上角有个按钮，你可以点击关闭侧边栏，两栏的博客瞬间变成一栏，再点又变了回来，@良心发现桑实在太有创意啦--可惜给升级毁了。

又到写代码很痛苦的时候了，妥妥的换个代码写几行的节奏!

检查一下，发现右上角那个“关闭侧边栏”的class是.showclose。再检查下主题的js,找到了如下的代码:

//侧边栏开关
$('.showclose').toggle(function(){
    $(this).text("✜ 显示侧边栏");
    $(".layout").css({ "border-right": "none", "background": "none" },300);
    $('#sidebar').hide(500).prev().animate({width: "859px"}, 1000);   
    },function(){
    $(this).text("♤ 关闭侧边栏");
    $(".layout").css({ "border-right": "1px solid #d5d5d5", "background": "#fff" },500);
    $('#sidebar').delay(800).slideDown(800).prev().animate({width: "640px"}, 800);
});

妥妥的，就是这个了。代码很清晰，点击一下换个function，两个function轮着换，jquery中改css属性。只可惜1.9+已经不能照搬了。但是，没关系，咱写丑一点也是可以fix的。稍稍做了点改动如下:

$('.showclose').on("click",function(){
    if($(this).hasClass('showclose_extend')){
        $(this).removeClass('showclose_extend');
        $(this).text("♤ 关闭侧边栏");
        $(".layout").css({ "border-right": "1px solid #d5d5d5", "background": "#fff" },500);
        $('#sidebar').delay(800).slideDown(800).prev().animate({width: "640px"}, 800);
    }else {
        $(this).addClass('showclose_extend');
        $(this).text("✜ 显示侧边栏");
        $(".layout").css({ "border-right": "none", "background": "none" },300);
        $('#sidebar').hide(500).prev().animate({width: "859px"}, 1000);
    }
});

意思还是一样,给那个.showclose加个label,每次执行先检查label,根据label分别做不同的事情。

就这样轻松愉快的搞定了 -- 突然发现也没花几分钟，算啦，继续搬砖去。