Javascript 只需第一次点击；img"；类轮换是工作，但不是为了另一次单击

只需第一次单击

img

类旋转到

180deg

并在课后显示，但如果再次将旋转

180deg

更改为

0deg

并在课后显示，则需要第二次单击

课后演示正在运行，但仅为第一次单击工作而旋转

<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
$(document).ready(function() {
    $(".op-cl").click(function() {
        $(".post").toggle("slow", function() {

            if ($('.img').css('transform', 'rotate(0deg)')) {
                $('.img').css('transform', 'rotate(180deg)');
            } else if ($('.img').css('transform', 'rotate(180deg)')) {
                $('.img').css('transform', 'rotate(0deg)');
            }

        });
    });
});

$（文档）.ready（函数（）{
$（“.op cl”）。单击（函数（）{
$（“.post”）.toggle（“慢”，函数（）{
if（$（'.img'）.css（'transform'，'rotate（0deg）'））{
$（'.img'）.css（'transform'，'rotate（180度））；
}else if（$（'.img'）.css（'transform'，'rotate（180度）））{
$（'.img'）.css（'transform'，'rotate（0度））；
}
});
});
});

$（“.img”）.css（'transform'、'rotate（0deg）

将始终解析为true，因为它返回

$（“.img”）

的jQuery链接。它设置变换属性，不计算。请参阅以供参考

要解决此问题，您可以添加一个类来检查它是否已旋转：

$(document).ready(function() {
    $(".op-cl").click(function() {
        $(".post").toggle("slow", function() {
            if ($('.img').hasClass('rotated')) {
                $('.img').css('transform', 'rotate(0)');
                $('.img').removeClass('rotated')
            } else {
                $('.img').css('transform', 'rotate(180deg)');
                $('.img').addClass('rotated');
            }
        });
    });
});

$（文档）.ready（函数（）{
$（“.op cl”）。单击（函数（）{
var-click=1；
$（“.post”）.toggle（“慢”，函数（）{
如果（单击%2！=0）{
$（'.img'）.css（'transform'，'rotate（180度））；
}否则如果（单击%2==0）{
$（'.img'）.css（'transform'，'rotate（0度））；
}
点击++；
});
});
});

如果要在两个值之间切换，最好使用

切换

：

$（文档）.ready（函数（）{
$（“.op cl”）。单击（函数（）{
$（'.img'）.toggle（函数（）{
$（“#用户_按钮”）.css（{transform:“旋转（0deg）”}）；
}，函数（）{
$（“#用户_按钮”）.css（{transform:“旋转（180度）”}）；
});
});
});
img{
宽度：200px；
高度：200px；
}

op cl



 <script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
    $(document).ready(function() {   
        $(".op-cl").click(function() {
            var click=1;
            $(".post").toggle("slow", function() {

                if (click % 2 !=0) {
                    $('.img').css('transform', 'rotate(180deg)');
                } else if (click % 2 ==0) {
                    $('.img').css('transform', 'rotate(0deg)');
                }
                click++;
            });
        });
    });