星级评级，鼠标悬停更改星级

Question

function change_star_image(star_id){
 $("#star_rating_image_"+star_id).css('background', 'url(images/full-star.png)');
 $("#star_rating_image_"+star_id).mouseout(function(){
    $("#star_rating_image_"+star_id).css('background', 'url(images/empty-star.png)');
 });
 var endval = star_id;

for (var i=1;i<=endval;i++){
     $("#star_rating_image_"+i).css('background', 'url(images/full-star.png)');
} 
}

我正在做问卷调查，

我有5个问题，ans类型是星级...

上面的代码片段工作正常，当我从左向右移动时，

例如，假设。我松开4星上的鼠标光标，

如果我再次回到，如果从2star开始，那么第3颗星不会禁用模式，所以根据我的代码，它显示为

例如，当我开始评分时..

1=bright star
2=bright star
3=bright star
4=nobright star
5=nobright star

如果我再次从第二颗星开始评级，那么评级星看起来就像

1=bright star
2=no bright star
3=bright star ======> it should go nobright star automatically , when i go the 2nd star..
4=nobright star
5=nobright star

Answer 1

看起来你并没有“关闭”任何一颗在你当前所在的星体之上的星体。我会将其更改为：

var numStars = 5;
function change_star_image(star_id){
    for (var i=1;i<numStars+1;i++){
         if(i<=star_id){
              $("#star_rating_image_"+i).css('background', 'url(images/full-star.png)');
         }else{
              $("#star_rating_image_"+i).css('background', 'url(images/empty-star.png)');
         }
    }
    $("#star_rating_image_"+star_id).mouseout(clearStars());
}
function clearStars(){
    for (var i=1;i<numStars+1;i++){
         $("#star_rating_image_"+i).css('background', 'url(images/empty-star.png)');
    }
}