jquery 评分插件 jquery.raty.js

1.引入jquery.raty.js或者jquery.raty.min.js

 <script src="jquery-1.4.1.min.js" type="text/javascript"></script>
 <script src="jquery.raty.js" type="text/javascript"></script>

2.在页面添加：

<div class="total_score" data-cname="service" data-sid="1">
    <span id="star" class="score"></span>
    <span id="result"></span>
    <div class="">
        <textarea class="desc" rows="3"></textarea>
    </div>
</div>

<script>

$('#star').raty({

    number:5, //图标个数

    path: "img",  //使用图标的位置
    hints: ['差', '一般', '好', '非常好', '全五星'], //鼠标放在图标上显示的文本
    starOff: 'off.png', //更改图标
    starOn: 'on-big', //更改图标
    target: '#result',
    targetKeep: true,
    click: function (score, evt) {
        console.log(this.id, "id", score, "score"); //获取用户选择的值
    }
});

//点击提交的值
function answer(node) {
    var flag = true;

    $(".score").each(function (index, el) {
        if (typeof $(el).raty('score') == "undefined") {
            flag = false;
            return false;
        }
    });


    if (flag == false) {
        console.log("必须选择所有的评价项,才可以提交!");
        return;
    }

    else {
        var postData = [];
        for (var li = 0; li < $('.score').length; li++) {
            // console.log($(".score").eq(li).raty('score'));
            var name = $(".total_score").eq(li).attr("data-cname");
            var id = $(".total_score").eq(li).attr("data-sid");
            var score = $(".score").eq(li).raty('score');
            var desc = $(".desc").eq(li).val();
            // console.log($(".desc").eq(li).val(), "desc");
            var cell = {};
            cell.name = name;
            cell.id = id;
            cell.score = score;
            cell.desc = desc;
            postData.push(cell);
        }
        console.log(postData);
    }

};

</script>

链接：https://github.com/wbotelhos/raty