首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

请问一个JS效果

2012-04-19 
请教一个JS效果各位大侠谁能告诉小弟淘宝的评价系统就是用星星评价星级的那个效果是怎么做的吗?附加代码不

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

[解决办法]

HTML code
<!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>
[解决办法]
可以用ajax异步调用数据操作,设定onChange事件
[解决办法]
http://code.usuishi.com/scripts/score.js
这个js就是
http://code.usuishi.com/Web/ResourceView.aspx?ResourceID=28
可以参考这里面的评分js效果

热点排行