jQuery实现星星评分功能

一、这是我做的调查问卷中的一个功能。（第三方MVC框架）

二、功能说明：1、用户点击星星，将值放到隐藏域中。2、用户可以重新点击星星修改回答。

前台JS代码：

<script type="text/javascript">
    //鼠标点击
    function picClick(obj) {
        var hid = $(obj).parent().find("input[type='hidden']");

        //赋值
        hid.val($(obj).attr("val"));
        hid.attr("num", $(obj).attr("num"));
        hid.attr("title", $(obj).attr("title"));
    }

    //鼠标移入
    function picMouseOver(obj) {
        $(obj).parent().find("img").attr("src", $(obj).attr("src1")); //全部置灰

        //设置高亮图片
        var currentNum = $(obj).attr("num");
        for (var i = 0; i < currentNum; i++) {
            $(obj).parent().find("img:eq(" + i + ")").attr("src", $(obj).attr("src2"));
        }

        //显示文本
        $(obj).parent().find("#spanResult").text($(obj).attr("title"));
    }

    //鼠标移出
    function picMouseOut(obj) {
        $(obj).parent().find("img").attr("src", $(obj).attr("src1")); //全部置灰
        $(obj).parent().find("#spanResult").text(""); //显示文本

        var hid = $(obj).parent().find("input[type='hidden']");
        if (hid.val()) {
            //设置高亮图片
            var currentNum = hid.attr("num");
            for (var i = 0; i < currentNum; i++) {
                $(obj).parent().find("img:eq(" + i + ")").attr("src", $(obj).attr("src2"));
            }

            //显示文本
            $(obj).parent().find("#spanResult").text(hid.attr("title"));
        }
    }
</script>

View Code