鍍金池/ 問答/網(wǎng)絡安全  HTML/ 星星評價怎麼做?

星星評價怎麼做?

<img class="rate_bstar bstar1" src="images/bstar.png">
            <img class="rate_bstar bstar2" src="images/bstar.png">
            <img class="rate_bstar bstar3" src="images/bstar.png">
            <img class="rate_bstar bstar4" src="images/bstar.png">
            <img class="rate_bstar bstar5" src="images/bstar.png">
$(".bstar1").mouseenter(function(e) {
  $('.bstar1').prop('src', 'images/star.png');
});

就是指標在哪裡,黃星星就會補滿
bstar 是灰的
star 是黃的
我越寫越不對,這樣好像不通?
怎麼寫才對?
_____________________________
更新

我寫這樣

$('.rate_bstar').hover(
   function() {
       $(this).prevAll().prop('src', 'images/star.png');
       $(this).prop('src', 'images/star.png');
       $(this).nextAll().prop('src', 'images/bstar.png');
   },
   function() {
       $(this).prevAll().prop('src', 'images/bstar.png');
       $(this).prop('src', 'images/bstar.png');
       $(this).nextAll().prop('src', 'images/bstar.png');
   }
);

發(fā)現(xiàn)這樣可以,但我點擊後我想讓他停在那個狀態(tài),不要消失

回答
編輯回答
舊顏

提供思路 :

var rate = 1;
"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate); 

2017年10月18日 05:24
編輯回答
孤星

直接找個庫,何必自己做呢

2018年2月20日 18:24
編輯回答
擱淺
$(".rate_bstar").mouseenter(function(e) {
  $(this).attr('src', 'images/star.png').prevAll().attr('src', 'images/star.png');
});

鼠標離開的時候全部改回來就行了。

2017年10月11日 20:52
編輯回答
晚風眠
<div id="startImg">
    <img class="rate_bstar bstar1" src="images/bstar.png">
    <img class="rate_bstar bstar2" src="images/bstar.png">
    <img class="rate_bstar bstar3" src="images/bstar.png">
    <img class="rate_bstar bstar4" src="images/bstar.png">
    <img class="rate_bstar bstar5" src="images/bstar.png">
</div>

$("#startImg").on("click",'img',a)
$('#startImg img').hover(a,b);
function a(){
    $(this).attr('src', 'images/star.png')
    $(this).prevAll().attr('src', 'images/star.png')
    $(this).nextAll().attr('src', 'images/bstar.png');
}
function b(){
    $('#startImg img').attr('src', 'images/bstar.png');
}
2017年8月8日 03:43