js实现的星星评分功能函数
本文实例讲述了js实现的星星评分功能函数。分享给大家供大家参考,具体如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>星星评分</title>
<scripttype="text/javascript">
functionrate(obj,oEvent){
//图片地址设置
varimgSrc='../images/s0.gif';//没有填色的星星
varimgSrc_2='../images/s1.gif';//打分后有颜色的星星
if(obj.rateFlag)return;
vare=oEvent||window.event;
vartarget=e.target||e.srcElement;
varimgArray=obj.getElementsByTagName("img");
for(vari=0;i<imgArray.length;i++){
imgArray[i]._num=i;
imgArray[i].onclick=function(){
if(obj.rateFlag)return;
obj.rateFlag=true;
alert(this._num+1);//this._num+1这个数字写入到数据库中,作为评分的依据
};
}
if(target.tagName=="IMG"){
for(varj=0;j<imgArray.length;j++){
if(j<=target._num){
imgArray[j].src=imgSrc_2;
}else{
imgArray[j].src=imgSrc;
}
}
}else{
for(vark=0;k<imgArray.length;k++){
imgArray[k].src=imgSrc;
}
}
}
</script>
</head>
<body>
<ponmouseover="rate(this,event)">
<imgsrc="../images/s0.gif"title="很烂"/>
<imgsrc="../images/s0.gif"title="一般"/>
<imgsrc="../images/s0.gif"title="还好"/>
<imgsrc="../images/s0.gif"title="较好"/>
<imgsrc="../images/s0.gif"title="很好"/>
</p>
</body>
</html>
希望本文所述对大家JavaScript程序设计有所帮助。