需要引入的js

	<script type="text/javascript" src="<%=basePath%>resources/js/jquery.min.js"></script>
<script type="text/javascript" src="<%=basePath%>resources/js/jquery.raty.js"></script>

需要的图片

jquery 星级评价插件jquery Raty的使用-LMLPHP

具体使用:

在需要显示星级的地方加一个div

<div id="star" data-num="3.5"></div>

在script中初始化

         $(function(){
$("#star").raty({
score:function(){
return $(this).attr("data-num");
},
starOn:'resources/img/star-on-big.png',
starOff:'resources/img/star-off-big.png',
starHalf:'resources/img/star-half-big.png',
readOnly:false,
halfShow:true,
size:34, })
});

score:需要显示的星星个数

starOn:鼠标放上去时显示的图标的位置

starOff:鼠标离开后显示的图标的位置

starHalf:需要显示的半星的标图的位置

readOnly:所显示的星星是否只读,默认非只读

halfShow:半个星星是否可以显示,默认可以

size:div显示的长度,太短了星星会换行

星星显示的效果如下:

jquery 星级评价插件jquery Raty的使用-LMLPHP

05-11 13:22