五角星可以在iconfont.cn上面找, 名字分别为:
五角星(满)、五角星(空)

代表空星星

代表实心星星
html 代码
<div class="start_box">
<i class="iconfont"></i>
<i class="iconfont"></i>
<i class="iconfont"></i>
<i class="iconfont"></i>
<i class="iconfont"></i>
</div>
jquery 代码
$(".start_box .iconfont").click(function() {
var parent = $(this).parent();
var tindex = $(this).index();
// 查找上次最后一颗实心星星的位置
var lastStartPosition = 0;
var iconfont = parent.find('.iconfont');
for (var i = iconfont.length - 1; i >= 0; i--) {
if (iconfont.eq(i).html() == "") {
lastStartPosition = i;
break;
}
}
// 如果上次最后一颗实心星在第一位,并且这次点击的星星是第一颗,并且点击星星是实心的。那么全部重置为空心星星。
// $(this).html() == "" 可能那个五角星看不到,可以试试console.log($(this).html());
if (lastStartPosition == 0 && tindex == 0 && $(this).html() == "") {
tindex = -1;
}
// 负责设置
parent.find('.iconfont').each(function(index, el) {
if (index <= tindex) {
$(this).html('');
} else {
$(this).html('');
}
});
});