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