Home>
<! 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>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Star Rating</title>
<script type="text/javascript">
function rate (obj, oevent) {
//Picture address setting
var imgsrc="../images/s0.gif";//Stars without coloring
var imgsrc_2="../images/s1.gif";//colored stars
if (obj.rateflag) return;
var e=oevent || window.event;
var target=e.target || e.srcelement;
var imgarray=obj.getelementsbytagname ("img");
for (var i=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 is written to the database,As a basis for scoring
  };
}
if (target.tagname == "img") {
  for (var j=0;j<imgarray.length;j ++) {
  if (j<= target._num) {
   imgarray [j] .src=imgsrc_2;
  } else {
   imgarray [j] .src=imgsrc;
  }
  }
} else {
  for (var k=0;k<imgarray.length;k ++) {
  imgarray [k] .src=imgsrc;
  }
}
}
</script>
</head>
<body>
<p onmouseover="rate (this, event)">
 <img src="../images/s0.gif" />
 <img src="../images/s0.gif" />
 <img src="../images/s0.gif" />
 <img src="../images/s0.gif" />
 <img src="../images/s0.gif" />
 </p>
</body>
</html>
  • Previous Detailed Java reflection mechanism
  • Next Follow me about global variables in javascript