jQuery评分插件实现星型评分

来源：互联网发布：c语言大小写字母互换编辑：程序博客网时间：2024/05/15 04:58
<!DOCTYPE html><html lang="en" dir="ltr"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">    <title>jquery星星评分插件</title>    <script src="/static/jquery/jquery-1.11.1.min.js"></script>    <script type="text/javascript" src="/static/star/jquery.raty.js"></script>    <style>        #function-demo {            float: left;        }        #function-demo1{            float: left;        }    </style></head><body><div style="width:500px; margin:100px auto;">    <div class="demo">        <div id="function-demo" class="target-demo"></div>        <div id="function-hint" class="hint"></div>    </div>    <div style="clear: both"></div>    <div class="demo" style="margin-top: 20px">        <div id="function-demo1" class="target-demo"></div>        <div id="function-hint1" class="hint"></div>    </div></div></body><script type="text/javascript">    $(function() {        $.fn.raty.defaults.path = '/static/star';        $('#function-demo').raty({            number: 3,//多少个星星设置            targetType: 'hint',//类型选择，number是数字值，hint，是设置的数组值            path      : '/static/star',            hints     : ['差','一般','好'],            cancelOff : 'cancel-off-big.png',            cancelOn  : 'cancel-on-big.png',            size      : 24,            starHalf  : 'star-half-big.png',            starOff   : 'star-off-big.png',            starOn    : 'star-on-big.png',            target    : '#function-hint',            cancel    : false,            targetKeep: true,            targetText: '请选择评分',            click: function(score, evt) {                alert('ID: ' + $(this).attr('id') + "\nscore: " + score + "\nevent: " + evt.type);            }        });        $('#function-demo1').raty({            number: 10,//多少个星星设置            score: 2,//初始值是设置            targetType: 'number',//类型选择，number是数字值，hint，是设置的数组值            path      : '/static/star',            cancelOff : 'cancel-off-big.png',            cancelOn  : 'cancel-on-big.png',            size      : 24,            starHalf  : 'star-half-big.png',            starOff   : 'star-off-big.png',            starOn    : 'star-on-big.png',            target    : '#function-hint1',            cancel    : false,            targetKeep: true,            precision : false,//是否包含小数            click: function(score, evt) {                alert('ID: ' + $(this).attr('id') + "\nscore: " + score + "\nevent: " + evt.type);            }        });    });</script></html>
参考源代码下载链接: http://dwtedx.com/download.html?bdkey=s/1pJ3CN7X 密码: afow
0 0