javascript - jQuery切换一些问题

Question

我想在不使用切换的情况下创建切换。当我按下按钮时，它应该将颜色更改为蓝色，如果再次按下按钮，它应该再次将颜色更改为黑色，在某些情况下它不起作用。 (抱歉我的英语水平很差)Fiddle

<div class='main'>
    <div class='button'>Click me</div>
</div>

.main {
    width:80%;
    height:300px;
    background:black;
    margin:0 auto;
    position:relative;
    overflow:hidden;
}
.button {
    padding: 10px 12px;
    background:#999;
    width:90px;
    margin: 110px auto;
    color:#fff;
    cursor:pointer;
}


var content = $('.main');
$('.button').on('click', function(){ 
    if(content == content.css({'background':'black'})){
        content.css({'background':'blue'})
    }else{
        content.css({'background-color':'black'})
    }
})

Answer 1

试试这个

<强> JSFIDDLE

   var content = $('.main');
    $('.button').on('click', function(){ 
        if(content.hasClass("blue")){
            content.css({'background':'black'})
            content.removeClass("blue").addClass("black");
        }else{
            content.css({'background':'blue'})
            content.removeClass("black").addClass("blue");
        }
    })