js评分控件

来源:互联网 发布:名创优品有淘宝店吗 编辑:程序博客网 时间:2024/05/20 16:13
  <script type="text/javascript">
        function indexOf(arr,element){
            for(var i=0;i<arr.length;i++){
                if(arr[i]==element){
                    return i;
                }
            }
            return -1;
        }
        function initEvent(){
            var rating = document.getElementById("rating");
            var tds = rating.getElementsByTagName("td");
            for(var i=0;i<tds.length;i++){
                var td=tds[i];
                td.style.cursor='pointer';
                td.onmouseover=function(){
                    var rating = document.getElementById("rating");
                    var tds = rating .getElementsByTagName("td");
                    var index = indexOf(tds,this);
                    for(var i=0;i<=index;i++){
                        tds[i].innerText='★';
                    }
                    for(var i=index+1;i<tds.length;i++){
                        tds[i].innerText='☆';
                    }
                }
            }
        }
    </script>
</head>
<body onload='initEvent()'>
<table id="rating"><tr><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td><td>☆</td></tr></table>
</body>
</html>
原创粉丝点击