javascript - 按下其他按钮后无法第二次按下按钮以激活旋转

Question

我的代码有问题：按下其他按钮后，我无法再次按下按钮来激活旋转。

你会在这里看到我的问题http://jsfiddle.net/HCP46/8/：

<script src="js/jquery-1.9.1.min.js"></script>
<script>
$("#continue1").click(function(){
$(".rotate").toggleClass("rotate1");
});
$("#continue2").click(function(){
$(".rotate").toggleClass("rotate2");
});
$("#continue3").click(function(){
$(".rotate").toggleClass("rotate3");
});
$("#continue4").click(function(){
$(".rotate").toggleClass("rotate4");
});
$("#continue5").click(function(){
$(".rotate").toggleClass("rotate5");
});
</script>

Answer 1

您需要删除所有其他rotate类，因为它们将在 CSS 中优先。

您还可以使用从元素派生旋转类名称的单个绑定来简化此操作。

$("button").on('click', function () {
    $(".rotate").removeClass().addClass("rotate rotate" + $(this).text());
});

http://jsfiddle.net/HCP46/9/