一款jQuery滑动星星评分效果,代码注释全。
使用方法
在页面引入jquery.min.js、jquery.raty.js文件
<script src="js/jquery.min.js"></script> <script src="js/jquery.raty.js" type="text/javascript"></script>
rat('star1','result1',1); ; function rat(star,result,m){ star= '#' + star; result= '#' + result; $(result).hide();//将结果DIV隐藏 $(star).raty({ hints: ['1', '2', '3', '4', '5'], number:5, path: "css/img", starOff: 'star-off-big.png', starOn: 'star-on-big.png', size: 24, start: 3, showHalf: true, //target: result, //targetKeep : false,//targetKeep 属性设置为true,用户的选择值才会被保持在目标DIV中,否则只是鼠标悬停时有值,而鼠标离开后这个值就会消失 click: function (score, evt) { //第一种方式:直接取值 alert('你的评分是'+score*m+'分'); } }); /*第二种方式可以设置一个隐蔽的HTML元素来保存用户的选择值,然后可以在脚本里面通过jQuery选中这个元素来处理该值。 弹出结果 var text = $(result).text(); $('img').click(function () { if ($(result).text() != text) { alert('你的评分是'+$(result).text()/m+'分'); alert(result); return; } });*/ }