小星星

String.prototype.inc = function(k1, k2){
    return k2 == null ? this.indexOf(k1) > -1 ? true : false : (k2 + this + k2) .indexOf(k2 + k1 + k2) > -1 ? true : false;
};
var is_IE5 = navigator.userAgent.inc("IE 5") || navigator.userAgent.inc("IE 6");
//定义星星：分别是blank(空白)，over(鼠标移上去),selected（被选择）
var STAR_IMG = new Array("o.gif", "o.gif", "s.gif");
//定义旁边的标签文字
var STAR_HINT = new Array("20分", "40分", "60分", "80分", "100分");
//用于取得对象
function oo(obj) {
    return typeof(obj) != "string" ? obj : (is_IE5 ? document.all(obj) : document.getElementById(obj));
}
 
//星星初始化
function initChgStar(ipt, hint) { 
   document.write(\\( onMouseOut="clearStar(\'' + ipt +'\', \'' + hint +'\')">));
    for(var i = 0; i < 5; i++) {
    document.write(\\+'\', ' + (i+1) + ', \'' + hint +'\')" align="absmiddle" style="cursor:hand" onClick="choStar(\'' + ipt +'\', ' + (i+1) + ', \'' + hint +'\')"/>');
    }
   
    document.write(\\'  id="'+hint +'">'); }
 
//鼠标移动上去，改变星星
function chgStar(ipt, num, hint) {
    if(num <= 5) {
    for(var i=0;i     oo('star_' + i + ipt).src = 'images/' + STAR_IMG[2] ;
    }
    for(i;i<5;i++) {
    oo('star_' + i + ipt).src = 'images/' + STAR_IMG[0] ;
    }
    }
    oo(hint).innerHTML = shwStarHint(num);  //右侧显示hint信息
}
 
//鼠标点击，改变星星

var req;
function choStar(ipt, num, hint) {
 
    var article = document.getElementById("article");
        var url = "grade.do?result="+num+"&articleId="+article.value;
        
         if (window.XMLHttpRequest) {
             req = new XMLHttpRequest();
         }else if (window.ActiveXObject) {
             req = new ActiveXObject("Microsoft.XMLHTTP");
         }

        if(req){
            req.open("post", url, true);
            req.onreadystatechange = callback;
            req.send(null);       
         }
        
   if(num <= 5) {
   for(var i=0;i     oo('star_' + i + ipt).src = 'images/' + STAR_IMG[2] ;
  }
   for(i;i<5;i++) {
    oo('star_' + i + ipt).src = 'images/' + STAR_IMG[0] ;
    }
  }
   oo(ipt).value = num;
   oo(hint).innerHTML = shwStarHint1(num);  //右侧显示hint信息
        }  
  
 
 function callback() { 
    if (req.readyState == 4) {
        if (req.status == 200) {
                 parseMessage();
        }else{
            alert ("Not able to retrieve description" + req.statusText);
        }      
    }
   }
    var node1;
   function parseMessage() { 
    var xmlDoc = req.responseXML.documentElement;  
    var node = xmlDoc.getElementsByTagName('info'); 
    node1 = xmlDoc.getElementsByTagName('value');

   alert(node[0].firstChild.nodeValue);   
  // alert(node1[0].firstChild.nodeValue);
   }
 
 function ready(ipt,hint){  
    var article = document.getElementById("article");
        var url = "grade.do?result="+0+"&articleId="+article.value;
        
         if (window.XMLHttpRequest) {
             req = new XMLHttpRequest();
         }else if (window.ActiveXObject) {
             req = new ActiveXObject("Microsoft.XMLHTTP");
         }

        if(req){
            req.open("post", url, true);
            req.onreadystatechange = callback1;
            req.send(null);       
         }
    oo(ipt).value = 0;  
   //oo(hint).innerHTML = shwStarHint1(num);  //右侧显示hint信息
  }
  function callback1() { 
    if (req.readyState == 4) {
        if (req.status == 200) {
                 parseMessage1();
        }else{
            alert ("Not able to retrieve description" + req.statusText);
        }      
    }
   }   

   function parseMessage1() { 
    var xmlDoc = req.responseXML.documentElement;  
    var node = xmlDoc.getElementsByTagName('info'); 
    var node2 = xmlDoc.getElementsByTagName('value'); 
 //  alert(node[0].firstChild.nodeValue);   
 //  alert(node2[0].firstChild.nodeValue);
   STAR_HINT.push(node2[0].firstChild.nodeValue);//动态在数组最后添加元素
   oo('shw_app').innerHTML = shwStarHint(6);//右侧显示hint信息
   }
   
   
//清除星星
function clearStar(ipt, hint)
{
    var num = oo(ipt).value ;
    if(num == "") num = 0;
    if(num <= 5) {
    for(var i=0;i     oo('star_' + i + ipt).src = 'images/' + STAR_IMG[2] ;
    }
    for(i;i<5;i++) {
    oo('star_' + i + ipt).src = 'images/' + STAR_IMG[0] ;
    }
    }
    if (num == 0) oo(hint).innerHTML = "";
    else oo(hint).innerHTML = shwStarHint1(num);
} 
 

//用于显示hint
function shwStarHint(num) {
    num = num <= 0 ? 0 : num - 1;
    return STAR_HINT[num];
}
function shwStarHint1(num) {
 return node1[0].firstChild.nodeValue;
}

 

jsp:
<!---->
<!---->

<%@ page contentType="text/html; charset=UTF-8" %>
<%@taglib uri="/WEB-INF/c.tld" prefix="c"%>
<%--<%@taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>--%>

<script language="javascript" src="/spring-crud/js/grade.js"></script>
\\<body onload = "ready('id_point','shw_app');">
\\<INPUT id=id_point type=hidden name=point>
\\<table><tr><td>
\\<SPAN onmouseout="clearStar('id_point','shw_app');">

\\<IMG id=star_0id_point onmouseover="chgStar('id_point', 1, 'shw_app');" style="CURSOR: hand" onclick="choStar('id_point', 1, 'shw_app');" src="images/o.gif" align=absMiddle border=0 >
\\<IMG id=star_1id_point onmouseover="chgStar('id_point', 2, 'shw_app');" style="CURSOR: hand" onclick="choStar('id_point', 2, 'shw_app');" src="images/o.gif" align=absMiddle border=0>
\\<IMG id=star_2id_point onmouseover="chgStar('id_point', 3, 'shw_app');" style="CURSOR: hand" onclick="choStar('id_point', 3, 'shw_app');" src="images/o.gif" align=absMiddle border=0>
\\<IMG id=star_3id_point onmouseover="chgStar('id_point', 4, 'shw_app');" style="CURSOR: hand" onclick="choStar('id_point', 4, 'shw_app');" src="images/o.gif" align=absMiddle border=0>
\\<IMG id=star_4id_point onmouseover="chgStar('id_point', 5, 'shw_app');" style="CURSOR: hand" onclick="choStar('id_point', 5, 'shw_app');" src="images/o.gif" align=absMiddle border=0>

\\</SPAN>
\\&nbsp;<SPAN id=shw_app></SPAN>
\\</td></tr>
\\<tr><td >
 \\<textarea name="article" id="article">5</textarea>
\\</td></tr>
\\</table>
\\</body>

 

 

<!---->

<script language="javascript" src="/spring-crud/js/grade.js"></script>

<!---->
<!---->
<!---->

<script language="javascript" src="/spring-crud/js/grade.js"></script>