请教一个JS效果

各位大侠谁能告诉小弟淘宝的评价系统就是用星星评价星级的那个效果是怎么做的吗？附加代码不胜感激！！！

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    </head>
    <body>
        <style>
            #QuacorGrading input
            {
                background: transparent url(upload_files/jsimg/grading.png) no-repeat scroll right center;
                border: 0 none;
                cursor: pointer;
                height: 30px;
                width: 30px;
                padding: 0;
                vertical-align: middle;
            }
        </style>
        <div id="QuacorGrading" style="position: absolute; top: 230px; left: 150px">
            <strong>评分</strong>
            <input name="1" type="button" />
            <input name="2" type="button" />
            <input name="3" type="button" />
            <input name="4" type="button" />
            <input name="5" type="button" />
            <input name="6" type="button" />
            <input name="7" type="button" />
            <input name="8" type="button" />
            <input name="9" type="button" />
            <input name="10" type="button" />
            <span id="QuacorGradingValue"><b><font size="5" color="#fd7d28">6.5</font></b>分</span>
            <script type="text/javascript">
                var GradList = document.getElementById("QuacorGrading").getElementsByTagName("input");
                for (var di = 0; di < parseInt(document.getElementById("QuacorGradingValue").getElementsByTagName("font")[0].innerHTML); di++) { GradList[di].style.backgroundPosition = 'left center'; }
                for (var i = 0; i < GradList.length; i++) {
                    GradList[i].onmouseover = function () {
                        for (var Qi = 0; Qi < GradList.length; Qi++) {
                            GradList[Qi].style.backgroundPosition = 'right center';
                        }
                        for (var Qii = 0; Qii < this.name; Qii++) {
                            GradList[Qii].style.backgroundPosition = 'left center';
                        }
                        //alert(GradList.length);
                        document.getElementById("QuacorGradingValue").innerHTML = '<b><font size="5" color="#fd7d28">' + this.name + '</font></b>分';
                    }
                }
            </script>
        </div>
    </body>
    </html>图片自己换下。。是这样？
      

  2.   

    可以用ajax异步调用数据操作，设定onChange事件
      

  3.   

    http://code.usuishi.com/scripts/score.js
    这个js就是
    http://code.usuishi.com/Web/ResourceView.aspx?ResourceID=28
    可以参考这里面的评分js效果