PHP+jQuery+Ajax+Mysql如何实现发表心情功能

2024-09-01 08:33:04

字体：大中小

来源：转载

供稿：网友

这篇文章通过php+jquery+ajax+mysql相结合，实现当用户浏览网站文章或者是论坛帖子后，想表达自己浏览后的心情，发表自己的感受，很多网站都提供了用户发表心情的功能，通过此功能可以很直观的分析文章或者是论坛对浏览者的用户体验度

实现发表心情功能通过php+jquery+ajax+mysql技术，大致流程我先给大家理下：主页index.html页面通过ajax获取心情图标及柱状图相关数据，当用户点击其中的一个心情图标时，向后台php发送请求，php对用户cookie验证（是否是首次提交），然后将数据库对应的心情字段内容加1，成功后返回前端页面，告诉首页index页面发表成功，并调整柱状图和统计数据。

请看效果图：

PHP+jQuery+Ajax+Mysql如何实现发表心情功能

html：

先看HTML，我们在index.html中放置一个#msg，用来显示操作结果信息，#mood是操作主区域，其中ul通过javascript异步加载心情图标、说明、柱状图以及统计信息。

复制代码代码如下:

		
		<div id="msg"></div>
		    <div id=mood>
		    <ul></ul>
		</div>
		 

PHP
首先我们在config.php配置文件中，配置数据库连接信息，以及示例相关参数。
$

host="localhost";

$db_user="root";

$db_pass="";

$db_name="demo";

$link=mysql_connect($host,$db_user,$db_pass);

mysql_select_db($db_name,$link);

mysql_query("SET names UTF8");

//心情说明，用半角逗号隔开

$moodname='震惊,不解,愤怒,杯具,无聊,高兴,支持,超赞';

//心情图标文件，用半角逗号隔开(template/images/目录)

$moodpic='a1.gif,a2.gif,a3.gif,a4.gif,a5.gif,a6.gif,a7.gif,a8.gif';

//统计心情柱图标最大高度

$moodpicheight=80;