用css制作星級(jí)評(píng)分
我們用php來(lái)實(shí)現(xiàn)
首先是實(shí)現(xiàn)的原理
從上一個(gè)css實(shí)現(xiàn)星級(jí)評(píng)分I 、II,可是看出,只要能識(shí)別onclick和將數(shù)據(jù)記錄至數(shù)據(jù)庫(kù)中存儲(chǔ),然后從數(shù)據(jù)庫(kù)中調(diào)用出數(shù)據(jù)進(jìn)行計(jì)算就
可以得到當(dāng)前的評(píng)分均值——當(dāng)前的分值。
1.下面是建立數(shù)據(jù)庫(kù)的sql
CREATE TABLE ratings(
id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
total_votes INT NOT NULL,
total_value INT NOT NULL,
which_id INT NOT NULL,
which_table VARCHAR(255),
used_ips LONGTEXT NULL
);
2.參數(shù)文件引用
<?php
require("connectDB.php");
require("closeDB.php");
require("tableName.php");
require("openDB.php");
?>
3.顯示投票程序和更新投票數(shù)據(jù)程序
<?php
$rating_posted=$_GET['vote'];//pased variable by the the stars value
$id=$_GET['id'];
$query=mysql_query("SELECT total_votes, total_value, used_ips FROM $tableName WHERE id='".$id."' ")or die(" Error: ".mysql_error());
$numbers=mysql_fetch_assoc($query);
$checkIP=unserialize($numbers['used_ips']);
$count=$numbers['total_votes'];//how many votes total
$current_rating=$numbers['total_value'];//total number of rating added together and stored
$sum=$rating_posted+$current_rating;// add together the current vote value and the total vote value
$tense=($count==1) ? "vote" : "votes";//plural form votes/vote
$voted=@mysql_fetch_assoc(@mysql_query("SELECT title FROM $tableName WHERE used_ips LIKE '%".$_SERVER['REMOTE_ADDR']."%' AND id='$id' ")); //Pattern match ip:suggested by Bramus! http://www.bram.us/ - this variable searches through the previous ip address that have voted and returns true or false
if($voted){
echo "<div class=\"rating\">".
"<ul class=\"star-rating\">".
"<li class=\"current-rating\" style=\"width:". @number_format($current_rating/$count,2)*20 ."px;\">Current rating.</li>".
"<li class=\"one-star\">1</li>".
"<li class=\"two-stars\" >2</li>".
"<li class=\"three-stars\">3</li>".
"<li class=\"four-stars\">4</li>".
"<li class=\"five-stars\">5</li>".
"</ul>".
"<p>Rating: <strong>".@number_format($current_rating/$count,2)."</strong> {".$count." ".$tense." cast} <br />You have previously voted.</p></div>";//show the current value of the vote with the current numbers
}else{
if(isset($_GET['vote'])){
if($sum==0){
$added=0;//checking to see if the first vote has been tallied
}else{
$added=$count+1;//increment the current number of votes
}
if(is_array($checkIP)){
array_push($checkIP,$_SERVER['REMOTE_ADDR']);//if it is an array i.e. already has entries the push in another value
}else{
$checkIP=array($_SERVER['REMOTE_ADDR']);//for the first entry
}
$insert=serialize($checkIP);
mysql_query("UPDATE $tableName SET total_votes='".$added."', total_value='".$sum."', used_ips='".$insert."' WHERE id='".$_GET['id']."'");
echo "<div class=\"rating\"><p>Rating: <strong>".@number_format($sum/$added,2)."</strong> {".$added." ".$tense." cast} <span>Thank you for your vote!</span></p></div>";//show the updated value of the vote
}else{
?>
4.訪問(wèn)者評(píng)分程序
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS: Star Rater Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="styles2-1.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="rating">
<p>How clear was this tutorial?</p>
<ul class="star-rating">
<li class="current-rating" style="width:<?php echo @number_format($current_rating/$count,2)*20 ?>px;">Current rating</li>
<li><a href="<?php echo $_SERVER['PHP_SELF'] . "?" .$_GET['section'] . "&id=" . $_GET['id'] . "&vote=1";?>" title="Rate this 1 star out of 5" class="one-star">1</a></li>
<li><a href="<?php echo $_SERVER['PHP_SELF'] . "?" .$_GET['section'] . "&id=" . $_GET['id'] . "&vote=1";?>" title="Rate this 2 stars out of 5" class="two-stars" >2</a></li>
<li><a href="<?php echo $_SERVER['PHP_SELF'] . "?" .$_GET['section'] . "&id=" . $_GET['id'] . "&vote=1";?>" title="Rate this 3 stars out of 5" class="three-stars" >3</a></li>
<li><a href="<?php echo $_SERVER['PHP_SELF'] . "?" .$_GET['section'] . "&id=" . $_GET['id'] . "&vote=1";?>" title="Rate this 4 stars out of 5" class="four-stars" >4</a></li>
<li><a href="<?php echo $_SERVER['PHP_SELF'] . "?" .$_GET['section'] . "&id=" . $_GET['id'] . "&vote=1";?>" title="Rate this 5 stars out of 5" class="five-stars" >5</a></li>
</ul>
</body></html>
5.最新評(píng)分結(jié)果提示
<?php
echo "<p>Rating: <strong>".@number_format($sum/$count,2)."</strong> {".$count." ".$tense." cast}</p></div>";//show the current updated value of the vote
} // end isset get vote
} //end voted true, false
?>
下一步是將結(jié)果記入數(shù)據(jù)庫(kù),現(xiàn)在沒(méi)有時(shí)間去研究了,請(qǐng)大家等待下一篇文章或者去原出處閱讀!
- jQuery+PHP星級(jí)評(píng)分實(shí)現(xiàn)方法
- jQuery動(dòng)態(tài)星級(jí)評(píng)分效果實(shí)現(xiàn)方法
- jquery插件star-rating.js實(shí)現(xiàn)星級(jí)評(píng)分特效
- 使用jQuery實(shí)現(xiàn)星級(jí)評(píng)分代碼分享
- 基于jQuery的星級(jí)評(píng)分插件
- 原生JS實(shí)現(xiàn)-星級(jí)評(píng)分系統(tǒng)的簡(jiǎn)單實(shí)例
- JavaScript制作淘寶星級(jí)評(píng)分效果的思路
- JS實(shí)現(xiàn)帶提示的星級(jí)評(píng)分效果完整實(shí)例
- javascript 星級(jí)評(píng)分效果(手寫(xiě))
- jQuery Raty 一款不錯(cuò)的星級(jí)評(píng)分插件
相關(guān)文章
用css來(lái)控制圖片大小顯示的實(shí)現(xiàn)方法與代碼
用css來(lái)控制圖片大小顯示的實(shí)現(xiàn)方法與代碼...2007-03-03css也瘋狂! 用background 插入flash播放器
css也瘋狂! 用background 插入flash播放器...2007-01-01在解決ul居中問(wèn)題時(shí)想到的幾點(diǎn)
在解決ul居中問(wèn)題時(shí)想到的幾點(diǎn)...2007-09-09position:relative/absolute無(wú)法沖破的等級(jí)
position:relative/absolute無(wú)法沖破的等級(jí)...2007-03-03