天极传媒:
天极网
比特网
IT专家网
52PK游戏网
极客修
全国分站

北京上海广州深港南京福建沈阳成都杭州西安长春重庆大庆合肥惠州青岛郑州泰州厦门淄博天津无锡哈尔滨

产品
  • 网页
  • 产品
  • 图片
  • 报价
  • 下载
全高清投影机 净化器 4K电视曲面电视小家电滚筒洗衣机
您现在的位置: 天极网 > 软件 > 网页>新闻>CSS实现星级评分III

CSS实现星级评分III

天极网2006-07-03 15:22我要吐槽

首先是实现的原理
从上一个css实现星级评分I 、II,可是看出,只要能识别onclick和将数据记录至数据库中存储,然后从数据库中调用出数据进行计算就
可以得到当前的评分均值——当前的分值。

1.下面是建立数据库的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.参数文件引用
以下是引用片段:
<?php
require("connectDB.php");
require("closeDB.php");
require("tableName.php");
require("openDB.php");
?>

3.显示投票程序和更新投票数据程序
以下是引用片段:
<?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.访问者评分程序
以下是引用片段:
<!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'] . "&amp;id=" . $_GET['id'] . "&amp;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'] . "&amp;id=" . $_GET['id'] . "&amp;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'] . "&amp;id=" . $_GET['id'] . "&amp;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'] . "&amp;id=" . $_GET['id'] . "&amp;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'] . "&amp;id=" . $_GET['id'] . "&amp;vote=1";?>" title="Rate this 5 stars out of 5" class="five-stars" >5</a></li>
</ul>
</body></html>
5.最新评分结果提示
以下是引用片段:
<?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
?>
下一步是将结果记入数据库,现在没有时间去研究了,请大家等待下一篇文章或者去远出处阅读!

原文:Creating a star rating system part (3)
链接:http://slim.climaxdesigns.com/tutorial.php?id=3
版权:版权归原作者所有,翻译文档版权归本人|greengnn,转载请注明出处www.jluvip.com/blog

我们用php来实现
先看看效果:http://gnn.80x86.cn/starrating

CSS实现星级评分III——欢迎访问天极软件CSS教程专区
作者:龙犊整理责任编辑:龙犊)
请关注天极网天极新媒体 最酷科技资讯
扫码赢大奖
评论
* 网友发言均非本站立场,本站不在评论栏推荐任何网店、经销商,谨防上当受骗!
热点推荐
微软Windows 10操作系统Win10系统在Win8的基础上对界面、特性以及跨平台方面做了诸多优化。[详细]
Windows 10 新视界 [进入频道][使用技巧][微博互动]
手机整机DIY企业级