php 如何建立简单的评论和5星评级系统？

How to build simple reviewing and 5-star rating system?

提问by Chris Vinz

I'm very new to web technologies and this is basically for a term project that my team is working on. We are working on a food review site.

我对网络技术很陌生，这基本上是我的团队正在从事的一个学期项目。我们正在开发一个食品评论网站。

As of now, I'm not quite sure how to implement a simple 5-star rating system. Am I supposed to use a server-side language like PHP or a client-side one like Javascript (w/ JQuery). Looking around it seems that JQuery is more suitable for this? Or would it be a combination of both?

到目前为止，我不太确定如何实现一个简单的 5 星评级系统。我应该使用像 PHP 这样的服务器端语言还是像 Javascript (w/ JQuery) 这样的客户端语言。环顾四周似乎JQuery更适合这个？或者它会是两者的结合？

What I'm looking for as far as functionality goes is:

就功能而言，我正在寻找的是：

• Stars light up when mouse hovers
• Page doesn't have to be reloaded when a star is clicked (not really needed)
• Some sort of average shown beside the stars
• Rating has to be stored somewhere in a MySQL database (Is this a good idea?)

• 鼠标悬停时星星亮起
• 单击星星时不必重新加载页面（不是真的需要）
• 星星旁边显示的某种平均值
• 评级必须存储在 MySQL 数据库中的某个地方（这是个好主意吗？）

I really apologize if the question sounds vague and stupid, I don't have much of a clue on how to implement this and I've tried googling around. If you have any questions about it please let me know.

如果这个问题听起来含糊不清和愚蠢，我真的很抱歉，我对如何实现这一点没有太多线索，我试过谷歌搜索。如果您对此有任何疑问，请告诉我。

Thank you very much.

非常感谢。

采纳答案by Buhake Sindi

Stars light up when mouse hovers
There's a brilliant tutorial on the web for designing a 5 star rating system: http://rog.ie/blog/css-star-rater. It's purely CSS so no need for Javascripting.

鼠标悬停时星星会亮起 网络上
有一个设计 5 星评级系统的精彩教程：http: //rog.ie/blog/css-star-rater。它纯粹是 CSS，所以不需要 Javascripting。

Page doesn't have to be reloaded when a star is clicked (not really needed)
Ajax is your friend, what I did was to have a <a class="one_star" href="javascript: submitRating(1, 5)">where <a>represented a star and the submitRating()function used Ajax to transmit my rating (1/5) to the server, the server stores the rating (and assigns the user that gave the rating) and recalculates the new average rating and submit the results back in JSON format.

页面没有被点击的明星时重新加载（不是真的需要）
Ajax是你的朋友，我所做的就是有一个<a class="one_star" href="javascript: submitRating(1, 5)">地方<a>代表的明星和submitRating()功能使用Ajax来传达我的等级（1/5）至服务器存储评分（并分配给评分的用户）并重新计算新的平均评分并以 JSON 格式提交结果。

Some sort of average shown beside the stars
Easy. Write a SQL script that, based on the product id, takes the sumof the average rating (i.e. 1/5 + 2/5 + 4/5, etc), divide it(sum) by the total amount of ratings and multiplies it by 100. Return the value back to the server, and from the server back to the client.

星星旁边显示的某种平均值
容易。编写一个 SQL 脚本，根据产品 id，取平均评分的总和（即 1/5 + 2/5 + 4/5 等），将其（总和）除以总评分并乘以它按 100。将值返回给服务器，然后从服务器返回给客户端。

Rating has to be stored somewhere in a MySQL database (Is this a good idea?)
I am using MySQL for this and it works like a charm....Any DB systems is fine.

评级必须存储在 MySQL 数据库中的某个地方（这是个好主意吗？）
我为此使用 MySQL，它的工作原理很吸引人......任何数据库系统都很好。

回答by Warty

Stars light up when mouse hovers
Simple, have an image for yellow star and an image for white star. When a star is hovered, all stars to the left have their "src"s changed to the yellow star, all stars to the right have their srcs changed to the white star.

鼠标悬停时星星会亮起
简单，有一个黄色星星的图像和一个白色星星的图像。当一颗星星悬停时，左边的所有星星的“src”都变成了黄色的星星，右边的所有星星的 srcs 都变成了白色的星星。

Page isn't reloaded when star is clicked
Look into Ajax/XHR
http://en.wikipedia.org/wiki/Ajax_(programming)
Hint: Have a .php file called vote.php , and pass into it the ID of your food and the rating given by the user.

单击星标时页面不会重新加载
查看 Ajax/XHR
http://en.wikipedia.org/wiki/Ajax_(programming)
提示：有一个名为 vote.php 的 .php 文件，并将您的 ID 传递给它食物和用户给出的评级。

Some sort of average shown between the stars
Most websites only show 0%, 50%, and 100% stars... users won't really freak out if they don't get 'exact precision'

星星之间显示的某种平均值
大多数网站只显示 0%、50% 和 100% 的星星......如果用户没有得到“精确的精度”，他们就不会真的吓坏

Rating should be stored in MySQL database
Any database system is fine. But yes, you would probably want to use an SQL database for this

评级应该存储在 MySQL 数据库中
任何数据库系统都可以。但是，是的，您可能希望为此使用 SQL 数据库

回答by Justin Johnson

Here's an answer to a similar question and should be a great start.

Here's an answer to a similar question，应该是一个很好的开始。

Turn a number into star rating display using jQuery and CSS

使用 jQuery 和 CSS 将数字转换为星级显示

回答by user262976

Yeah you're approach sounds perfect. there are a couple pieces:

是的，你的方法听起来很完美。有几个部分：

stars with hover effect:

具有悬停效果的星星：

jquery: http://www.fyneworks.com/jquery/star-rating/

jquery：http: //www.fyneworks.com/jquery/star-rating/

prototype: http://www.fyneworks.com/jquery/star-rating/

原型：http: //www.fyneworks.com/jquery/star-rating/

css: http://www.henryhoffman.com/css-star-rating-tutorial.html

css：http: //www.henryhoffman.com/css-star-rating-tutorial.html

onclick can invoke an ajax call with jquery: http://api.jquery.com/jQuery.post/

onclick 可以使用 jquery 调用 ajax 调用：http: //api.jquery.com/jQuery.post/

then on the server side it can be maintained in a rating table

然后在服务器端它可以维护在评级表中

theres a longer example here:

这里有一个更长的例子：

http://webtint.net/tutorials/5-star-rating-system-in-php-mysql-and-jquery/

http://webtint.net/tutorials/5-star-rating-system-in-php-mysql-and-jquery/

回答by Xorlev

A combination of JS and PHP is the way to go (if PHP is your chosen server-side language). JQuery is a good way to easily implement a sort of starring system, I once developed this for one of my sites I later removed. It was a simple thing that had onrollover events linked to 5 images. When clicked, if it was "id 4", it'd send that as the vote of the user using jQuery's .post() function to a PHP script which noted the user and recorded the vote in a MySQL database if they hadn't already voted.

JS 和 PHP 的组合是要走的路（如果 PHP 是您选择的服务器端语言）。JQuery 是一种轻松实现某种星级系统的好方法，我曾经为我后来删除的一个网站开发了它。这是一个简单的事情，将 onrollover 事件链接到 5 个图像。当点击时，如果它是“id 4”，它会使用 jQuery 的 .post() 函数将它作为用户的投票发送到一个 PHP 脚本，该脚本记录用户并将投票记录在 MySQL 数据库中，如果他们没有已经投票。

回答by Frank Schwieterman

To have a nice star-clicky control, yeah you need javascript. So you should do jQuery.

要拥有一个漂亮的星星点击控件，是的，您需要 javascript。所以你应该做jQuery。

Yes, you'll want to store stuff in a database. You could use PHP and MySQL for that.

是的，您需要将内容存储在数据库中。为此，您可以使用 PHP 和 MySQL。

Given this is a class assignment, thats a lot to implement. Consider cheating by using an existing CMS. Drupal in particular has functionality similar to what you ask for. You won't have to learn much of Drupal, just buy the book "Using Drupal". Chapter 4 will show you how to:

鉴于这是一个课堂作业，要实现的东西很多。考虑使用现有的 CMS 作弊。特别是 Drupal 具有与您要求的功能类似的功能。您不必学习很多 Drupal，只需购买“使用 Drupal”一书即可。第 4 章将向您展示如何：

... build a community product review website, with ... and Fivestar modules providing a rating widget.

... 建立一个社区产品评论网站，其中 ... 和 Fivestar 模块提供评级小部件。

Drupal is PHP based and uses MySQL as its database, so it seems to match where you were going. It may take a bit to get Drupal running... but then you can get to chapter 4 in a snap.

Drupal 基于 PHP 并使用 MySQL 作为其数据库，因此它似乎与您要去的地方相匹配。运行 Drupal 可能需要一点时间……但是您可以快速进入第 4 章。

If the teacher insists you write code, Drupal is open source and its easy to add custom modules.

如果老师坚持要你写代码，Drupal 是开源的，很容易添加自定义模块。