Javascript jquery-rotate只工作一次

我想旋转一个div，我是这样做的，但它可以工作一次，我想，当它悬停时，它开始旋转，当鼠标离开时，它会旋转回来，我是这样做的，但它可以工作一次

#项目{
宽度：150px；
高度：150像素；
背景:#902；
}
.box_旋转{
-webkit变换：旋转（180度）；/*铬合金，Safari 3.1+*/
-moz变换：旋转（180度）；/*Firefox 3.5-15*/
-ms变换：旋转（180度）；/*IE 9*/
-o变换：旋转（180度）；/*Opera 10.50-12.00*/
变换：旋转（180度）；/*Firefox 16+，IE 10+，Opera 12.50+*/
}
.box_旋转2{
-webkit变换：旋转（-180度）；/*铬合金，Safari 3.1+*/
-moz变换：旋转（-180deg）；/*Firefox 3.5-15*/
-ms变换：旋转（-180度）；/*IE 9*/
-o变换：旋转（-180度）；/*Opera 10.50-12.00*/
变换：旋转（-180度）；/*Firefox 16+，IE 10+，Opera 12.50+*/
}
.box_转换{
-webkit过渡版：所有1.5s都轻松推出；/*Chrome 1-25，Safari 3.2+*/
-moz过渡：所有1.5版本都可以轻松过渡；/*Firefox 4-15*/
-o型过渡：所有1.5秒放松；/*Opera 10.50–12.00*/
过渡：所有1.5s都可以轻松过渡；/*Chrome 26、Firefox 16+、IE 10+、Opera 12.50+*/
}
$（“文档”）.ready（函数（）{
函数rot（）{
$（this.addClass（'box\u rotate box\u transition'）；
}
函数rot2（）{
$（this.addClass（'box\u rotate2 box\u transition'）；
}
$（“项目”）。悬停（旋转，旋转2）；
});

在添加新类之前，您需要删除以前的动画类。将您的

js

更改为以下内容

$("document").ready(function () {
    function rot() {
        $(this).removeClass('box_rotate2 box_transition').addClass('box_rotate box_transition');
    }
    function rot2() {
        $(this).removeClass('box_rotate box_transition').addClass('box_rotate2 box_transition');
    }

    $("#Item").hover(rot, rot2);
});

完整代码

函数rot（）{
$（this）.removeClass（'box\u rotate2 box\u transition'）.addClass（'box\u rotate box\u transition'）；
}
函数rot2（）{
$（this）.removeClass（'box\u rotate box\u transition'）.addClass（'box\u rotate2 box\u transition'）；
}
$（“项目”）。悬停（旋转，旋转2）
#项目{
宽度：150px；
高度：150像素；
背景:#902；
}
.box_旋转{
-webkit变换：旋转（180度）；
/*Chrome，Safari 3.1+*/
-moz变换：旋转（180度）；
/*火狐3.5-15*/
-ms变换：旋转（180度）；
/*IE 9*/
-o变换：旋转（180度）；
/*歌剧院10.50-12.00*/
变换：旋转（180度）；
/*Firefox 16+、IE 10+、Opera 12.50+*/
}
.box_旋转2{
-webkit变换：旋转（-180度）；
/*Chrome，Safari 3.1+*/
-moz变换：旋转（-180度）；
/*火狐3.5-15*/
-ms变换：旋转（-180度）；
/*IE 9*/
-o变换：旋转（-180度）；
/*歌剧院10.50-12.00*/
变换：旋转（-180度）；
/*Firefox 16+、IE 10+、Opera 12.50+*/
}
.box_转换{
-webkit过渡：所有1.5s轻松推出；
/*Chrome 1-25，Safari 3.2+*/
-moz过渡：所有1.5秒的缓变；
/*火狐4-15*/
-o型过渡：所有1.5s缓解；
/*歌剧院10.50–12.00*/
过渡：所有1.5秒放松；
/*Chrome 26、Firefox 16+、IE 10+、Opera 12.50+*/
}