jQuery 评分前台

html code:

<ul class="comments_grade_new red">
				<li>
					<span class="left">XXXX：</span>
					<span class="grade">
					<a class="on" href="javascript:void(0)" rel="1" title="很差">很差</a>
					<a class="on" href="javascript:void(0)" rel="2" title="较差">较差</a>
					<a class="on" href="javascript:void(0)" rel="3" title="一般">一般</a>
					<a class="on" href="javascript:void(0)" rel="4" title="较好">较好</a>
					<a class="on" href="javascript:void(0)" rel="5" title="很好">很好</a>
					</span>
					<span class="grade_tips"></span>
				</li>
				<li>
					<span class="left">XXXX：</span>
					<span class="grade">
					<a class="on" href="javascript:void(0)" rel="1" title="很差">很差</a>
					<a class="on" href="javascript:void(0)" rel="2" title="较差">较差</a>
					<a class="on" href="javascript:void(0)" rel="3" title="一般">一般</a>
					<a class="on" href="javascript:void(0)" rel="4" title="较好">较好</a>
					<a class="on" href="javascript:void(0)" rel="5" title="很好">很好</a>
					</span><span class="grade_tips"></span>
				</li>
				<li>
					<span class="left">镜头扩展：</span>
					<span class="grade">
					<a class="on" href="javascript:void(0)" rel="1" title="很差">很差</a>
					<a class="on" href="javascript:void(0)" rel="2" title="较差">较差</a>
					<a class="on" href="javascript:void(0)" rel="3" title="一般">一般</a>
					<a class="on" href="javascript:void(0)" rel="4" title="较好">较好</a>
					<a class="on" href="javascript:void(0)" rel="5" title="很好">很好</a>
					</span><span class="grade_tips"></span>
				</li>
				<li>
					<span class="left">XXXX：</span>
					<span class="grade">
					<a class="on" href="javascript:void(0)" rel="1" title="很差">很差</a>
					<a class="on" href="javascript:void(0)" rel="2" title="较差">较差</a>
					<a class="on" href="javascript:void(0)" rel="3" title="一般">一般</a>
					<a class="on" href="javascript:void(0)" rel="4" title="较好">较好</a>
					<a class="on" href="javascript:void(0)" rel="5" title="很好">很好</a>
					</span><span class="grade_tips"></span>
				</li>
			</ul>

 

 js code:

/*
*jQuery 评分
*author:shing
*/
/*记录选择*/
function saveGrade(obj){
	var gradeArray = new Array();
	obj.find("a").each(function(i){
		gradeArray[i] = jQuery(this).attr("class");
	});
	return gradeArray;
}

jQuery(document).ready(function(){
	var tempArray = new Array();
	var _tempArray = new Array();
	jQuery(".grade").each(function(i){
		var obj = jQuery(".grade").eq(i);
		tempArray[i] = 	saveGrade(obj);	
		var span_obj = jQuery(this).next("span");
		//鼠标放在上面
		jQuery(this).find("a").mousemove(function(){
			var currentIndex = 0;
			currentIndex = jQuery(".grade").eq(i).find("a").index(jQuery(this)[0]);
			jQuery(".grade").eq(i).find("a").each(function(k){
				if(k <=currentIndex){
					jQuery(this).removeClass();
					jQuery(this).addClass("on");
					span_obj.text(jQuery(this).text());
				}else{
					jQuery(this).removeClass();
				}
			});
		})
		//鼠标点击
		.click(function(){
			var obj = jQuery(".grade").eq(i);
			tempArray[i] = saveGrade(obj);
			_tempArray[i]= jQuery(this).text();
		})
		//鼠标离开
		.mouseout(function(){
			jQuery(".grade").eq(i).find("a").each(function(n){
				jQuery(this).removeClass();
				jQuery(this).addClass(tempArray[i][n]);
				if(typeof(_tempArray[i])=='undefined'){
					span_obj.text('');
				}else{
					span_obj.text(_tempArray[i]);
				}
			});
			return false;		
                 });
	});
});