java星级评价代码_JS实现星级评分

朋友给我一份星级评价的html代码，说不能实现多行星级评价，让我帮忙看一下。

帮朋友修改的，怕到时候自己也用到了，先把代码贴这里。

/p>

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

星级评分系统

body,div,ul,li,p{margin:0;padding:0;}

body{color:#666;font:12px/1.5 Arial;}

ul{list-style-type:none;}

.star{position:relative;width:600px;margin:10px auto;}

.star ul,.star span{float:left;display:inline;height:19px;line-height:19px;}

.star ul{margin:0 10px;}

.star li{float:left;width:24px;cursor:pointer;text-indent:-9999px;background:url(star.png) no-repeat;}

.star strong{color:#f60;padding-left:10px;}

.star li.on{background-position:0 -28px;}

function neo(id){ //这里id

var oStar = document.getElementById(id);

var aLi = oStar.getElementsByTagName("li");

var oUl = oStar.getElementsByTagName("ul")[0];

var oP = oStar.getElementsByTagName("p")[0];

var i = iScore = iStar = 0;

for (i = 1; i <= aLi.length; i++){

aLi[i - 1].index = i;

//点击后进行评分处理

aLi[i - 1].onclick = function (){

fnPoint(this.index);

//计算浮动层位置

oP.style.left = oUl.offsetLeft + this.index * this.offsetWidth - 104 + "px";

//匹配浮动层文字内容

oP.innerHTML = "" + this.index + " 分";

}

}

//评分处理

function fnPoint(iArg){

//分数赋值

iScore = iArg || iStar;

for (i = 0; i < aLi.length; i++) aLi[i].className = i < iScore ? "on" : "";

}

};

物流速度

• 1
• 2
• 3
• 4
• 5

服务态度

• 1
• 2
• 3
• 4
• 5

发货速度

• 1
• 2
• 3
• 4
• 5

其实用的就是网上的一些办法，然后稍微修改了下。仅供参考。

实现效果：