2

我有一个这样定义的星级评分系统：

<span class="rating_container"> 
    <span class="star_container">  
        <a rel="nofollow" href="" class="star star_1" >1<span class="rating">Terrible</span></a>   
        <a rel="nofollow" href="" class="star star_2" >2<span class="rating">Bad</span></a>
        <a rel="nofollow" href="" class="star star_3" >3<span class="rating">Bad</span></a>
        <a rel="nofollow" href="" class="star star_4" >4<span class="rating">OK</span></a>   
        <a rel="nofollow" href="" class="star star_5" >5<span class="rating">OK</span></a>   
        <a rel="nofollow" href="" class="star star_6" >6<span class="rating">OK</span></a>   
        <a rel="nofollow" href="" class="star star_7" >7<span class="rating">Good</span></a>   
        <a rel="nofollow" href="" class="star star_8" >8<span class="rating">Good</span></a>   
        <a rel="nofollow" href="" class="star star_9" >9<span class="rating">Excellent</span></a>   
        <a rel="nofollow" href="" class="star star_10" >10<span class="rating">Excellent</span></a>  
    </span> 
</span>

当鼠标悬停时，每个单独的星都被着色。如何用 jquery 模拟这个？例如，我想将鼠标悬停在星号 5 上。这就是我尝试过的：

     $('.star.star_5').addClass('active');

我错过了什么？

4

4 回答 4

5

尝试 ：

$(".star_5").trigger('mouseover');

这将触发鼠标悬停动作，而不是模拟它，提供一种针对鼠标悬停处理程序更改的未来证明措施。

于 2013-01-09T21:12:06.853 回答
2

我想你需要的是

$('.star.star_5').addClass('active');

注意.starand.star_5和_in之间没有空格star_5。（感谢@wirey）

于 2013-01-09T21:10:27.947 回答
0

在 CSS（这是 jQuery 选择器所基于的）中，.class1 .class2表示“具有 class2 的元素，其祖先具有 class1”。这不是你想要的。你想要.class1.class2这意味着“一个同时具有 class1 和 class2 的元素”：

$('.star.star_5').addClass('active');
于 2013-01-09T21:13:15.427 回答
0

如果您真的想模拟一个事件：您可以使用相应 jQuery 函数的无参数形式触发 JavaScript 事件。例如：

$('.star.star_5').mouseover();
于 2013-01-09T21:13:48.417 回答