jsRapStar是一款jQuery评分插件。该jqurey评分插件取值可以精确到小数位,支持自定义评分样式,非常实用。
使用方法
在页面中引入jquery和jsRapStar.js、jsRapStar.css文件。
<link href="css/jsRapStar.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jsRapStar.js"></script>
HTML
使用一个<div>作为容器,在div上指定start属性作为初始值。
<div id="example" start="3"></div>
初始化插件
在页面DOM元素加载完毕之后,通过下面的方法来初始化该jQuery评分插件。
$('#example').jsRapStar();
可以实用unicode字符来自定义星星。
$('#example').jsRapStar({
star:'★'
});
可以自定义星星的颜色和高度等属性。
$('#example').jsRapStar({
// color
colorFront: 'yellow',
// background color
colorBack: 'white',
// size in pixels
starHeight: 32
});
可以定义使用小数级评分数。
$('#example').jsRapStar({
step: true
});
也可以禁止选择评分。
$('#example').jsRapStar({
enabled: false
});
该jQuery评分插件的可用事件有:
$('#example').jsRapStar({
onClick:function(score){
$(this)[0].StarF.css({color:'red'});
alert(score);
},
onMousemove:function(score){
$(this).attr('title','Rating: '+score);
}
});
该jQuery评分插件的github地址为:https://github.com/Thibor/jsRapStar