js影视网站星级打分代码

版权：原创更新时间：1年以上
[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]
以下是 js影视网站星级打分代码的示例演示效果:
当前平台(PC电脑)
平台:
整屏预览
部分效果截图:
HTML代码(index.html):
<!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>js影视网站星级打分代码</title>
<link href="css/style.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.1.4.2-min.js"></script>
</head>
<body>
<!--演示内容开始-->
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif , "新宋体";}
/* sitelogo */
#sitelogo{position:relative;margin:40px auto;width:430px;height:60px;border:solid 1px #ddd;padding:10px 10px 0 10px;}
#sitelogo span{display:block;float:left;}
#sitelogo img{border:#e0e0e0 1px solid;padding:2px;}
#sitelogo a:hover img{border:#69f 1px solid;padding:2px;}
/* sitelogo ul */
#sitelogo ul{display:block;float:left;width:100px;height:28px;position:relative;background: url('images/starrating.gif') top left repeat-x;margin:22px 5px 0 32px;}
#sitelogo ul li{float:left;}
#sitelogo ul li a{display:block;width:10px;height:28px;text-indent:-9000px;z-index:20;position:absolute;overflow:hidden;}
#sitelogo ul li a:hover{background:url('images/starrating.gif') left 35px;z-index:2;left:0;}
#sitelogo ul a.star1{left:0px;}
#sitelogo ul a.star1:hover{width:10px;}
#sitelogo ul a.star2{left:10px;}
#sitelogo ul a.star2:hover{width:20px;}
#sitelogo ul a.star3{left:20px;}
#sitelogo ul a.star3:hover{width:30px;}
#sitelogo ul a.star4{left:30px;}
#sitelogo ul a.star4:hover{width:40px;}
#sitelogo ul a.star5{left:40px;}
#sitelogo ul a.star5:hover{width:50px;}
#sitelogo ul a.star6{left:50px;}
#sitelogo ul a.star6:hover{width:60px;}
#sitelogo ul a.star7{left:60px;}
#sitelogo ul a.star7:hover{width:70px;}
#sitelogo ul a.star8{left:70px;}
#sitelogo ul a.star8:hover{width:80px;}
#sitelogo ul a.star9{left:80px;}
#sitelogo ul a.star9:hover{width:90px;}
#sitelogo ul a.star10{left:90px;}
#sitelogo ul a.star10:hover{width:100px;}
#currentrating{background:url('images/starrating.gif') left bottom;position:absolute;height:21px;width:0;display:block;text-indent:-9000px;z-index:1;}
#sitelogo #pftip{position:absolute;top:8px;left:168px;width:200px;color:#999;font-size:14px;}
#sitelogo #pfno{margin:24px 8px 0 0;width:40px;color:green;font-family:Arial;font-weight:bold;font-size:14px;}
#sitelogo p{width:110px;float:left;color:#666;}
#sitelogo p span{font-family:Arial;font-style:italic;color:#f60;}
#sitelogo #pfshi{font-size:32px;line-height:28px;font-weight:bold;}
#sitelogo #pfge{font-size:18px;line-height:22px;}
#sitelogo p span.no{width:110px;clear:both;color:#666;font-style:normal;font-size:12px;}
</style>

<script type="text/javascript">
function GI(id){
	return document.getElementById(id);
}
function infen(var1){
	var fentip=new Array("","很差，浪费生命","很差，浪费生命","不喜欢","不喜欢","一般，不妨一看","一般，不妨一看","一般，不妨一看","喜欢，值得推荐","喜欢，值得推荐","非常喜欢，不容错过");
	if (var1>0){
		GI("pfno").innerHTML=var1+"分 ";
		GI("pftip").innerHTML=fentip[var1];
		GI("currentrating").style.display="none";
	}
	else{
		GI("pfno").innerHTML="";
		GI("pftip").innerHTML="";
		GI("currentrating").style.display="block";
	}
}

var http_request = false;
function makeRequest(url, functionName, httpType, sendData) {
	http_request = false;
	if (!httpType) httpType = "GET";
	if (window.XMLHttpRequest) { // Non-IE...
		http_request = new XMLHttpRequest();
		if (http_request.overrideMimeType) {
			http_request.overrideMimeType('text/plain');
		}
	} else if (window.ActiveXObject) { // IE
		try {
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try {
				http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {}
		}
	}
	if (!http_request) {
		alert('无法发送请求，请稍后再试。');
		return false;
	}
	var changefunc="http_request.onreadystatechange = "+functionName;
	eval (changefunc);
	//http_request.onreadystatechange = alertContents;
	http_request.open(httpType, url, true);
	http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	http_request.send(sendData);
}
function getReturnedText () {
	if (http_request.readyState == 4) {
		if (http_request.status == 200) {
			var messagereturn = http_request.responseText;
			return messagereturn;
		} else {
			alert('请求出现问题，请稍后再试。');
		}
	}
}
function EchoReturnedText () {
	if (http_request.readyState == 4) {
		if (http_request.status == 200) {
			var messagereturn = http_request.responseText;
			if(messagereturn!='isfail'){
				var r;
				r=messagereturn.split('|');
				if(r.length!=1){
					if (r[0]=="8")
					{
						alert("评分成功，感谢您的参与。")
						GI("pfshi").innerHTML=r[1];
						GI("pfge").innerHTML=r[2];
						GI("pfren").innerHTML=r[3];
						GI("currentrating").style.width=r[4]+"px";
					}
				}
				else{
					if (messagereturn=="1")
					{
						alert("您已经参加过该网站的评分。")
					}
					else if (messagereturn=="2")
					{
						alert("评分失败，请稍后再试。")
					}
					else if (messagereturn=="3")
					{
						alert("两次评分间隔时间太短，请稍后再试。")
					}
					else{
						alert(messagereturn);
					}
					//document.getElementById('ajaxarea').innerHTML=messagereturn;
				}
			}
		} else {
			alert('请求出现问题，请稍后再试。');
		}
	}
}
</script>
	<div id="sitelogo">
		<span><a href="#" ><img src="images/zzsc.gif" width="120" height="40" alt="jsfoot网页特效" /></a></span>
		<ul class="starrating">
			<li id="currentrating"></li>
			<li><a onmouseover="infen(1)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=1','EchoReturnedText','GET','');" class="star1">1</a></li>
			<li><a onmouseover="infen(2)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=2','EchoReturnedText','GET','');" class="star2">2</a></li>
			<li><a onmouseover="infen(3)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=3','EchoReturnedText','GET','');" class="star3">3</a></li>
			<li><a onmouseover="infen(4)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=4','EchoReturnedText','GET','');" class="star4">4</a></li>
			<li><a onmouseover="infen(5)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=5','EchoReturnedText','GET','');" class="star5">5</a></li>
			<li><a onmouseover="infen(6)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=6','EchoReturnedText','GET','');" class="star6">6</a></li>
			<li><a onmouseover="infen(7)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=7','EchoReturnedText','GET','');" class="star7">7</a></li>
			<li><a onmouseover="infen(8)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=8','EchoReturnedText','GET','');" class="star8">8</a></li>
			<li><a onmouseover="infen(9)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=9','EchoReturnedText','GET','');" class="star9">9</a></li>
			<li><a onmouseover="infen(10)" onmouseout="infen(0)" href="javascript:makeRequest(#/e/enews/?enews=AddInfoPfen&classid=1290&id=2752&fen=10','EchoReturnedText','GET','');" class="star10">10</a></li>
		</ul>
		<span id="pftip"></span>
		<span id="pfno"></span>
		<p><span id="pfshi">9</span><span id="pfge">.5</span><span class="no">(已有<label id="pfren">48</label>人评分)</span></p>
	</div>
<!--演示内容结束-->
</body>
</html>
附件:下载该文件资源,减少时间成本(增值服务)