开源的插件实现五星评级的各种效果
插件 jQuery Raty
下载地址
https://github.com/wbotelhos/raty
演示地址
http://www.jq22.com/yanshi6430
也可以下载源码后，打开demo会有全部功能展示
使用案例
需要下载raty.js并从images文件夹获取图片，放到文件夹。jquery用的在线的不用下载。
starOn:‘imgs/star-on.png’,
starOff:‘imgs/star-off.png’,
starHalf:‘imgs/star-half.png’,
修改路径，直接copy下面代码就可以运行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="js/jquery.raty.js"></script>
<div id="star" data-num="2.5"></div>
<script>
$(function(){
$("#star").raty({
score:function(){
return $(this).attr("data-num");
},
starOn:'imgs/star-on.png',
starOff:'imgs/star-off.png',
starHalf:'imgs/star-half.png',
readOnly:false,
halfShow:true,
size:34,
})
});
</script>
</body>
</html>
说明
score:需要显示的星星个数
starOn：鼠标放上去时显示的图标的位置
starOff：鼠标离开后显示的图标的位置
starHalf：需要显示的半星的标图的位置
readOnly：所显示的星星是否只读，默认非只读
halfShow：半个星星是否可以显示，默认可以
size：div显示的长度，太短了星星会换行
————————————————
版权声明：本文为CSDN博主「如何在3年拿到50K」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/kouryoushine/java/article/details/93606117
本文来自 https://blog.csdn.net/kouryoushine/article/details/93606117
