PHP+Ajax实现文章心情投票功能(代码实例)
导读:收集整理的这篇文章主要介绍了PHP+Ajax实现文章心情投票功能(代码实例),觉得挺不错的,现在分享给大家,也给大家做个参考。一个PHP+Ajax实现文章心情投票功能实例,可以学习了解实现投票的基本流程:通过ajax获取心情图标及柱状图相关...
收集整理的这篇文章主要介绍了PHP+Ajax实现文章心情投票功能(代码实例),觉得挺不错的,现在分享给大家,也给大家做个参考。一个PHP+Ajax实现文章心情投票功能实例,可以学习了解实现投票的基本流程:通过ajax获取心情图标及柱状图相关数据,当用户点击其中的一个心情图标时,向Ajax.php发送请求,PHP验证用户cookie防止重复提交,然后将MySQL中对应的数据心情字段内容加1,成功后返回前端页面,并更新柱状图和统计数据。
发表心情:
$id = (int)$_POST['id'];
//文章或帖子id $mid = (int)$_POST['moodid'];
//心情id(配置文件中提供8种心情) if(!$mid || !$id){
echo "此链接不存在";
exIT;
}
$havemood = chk_mood($id);
//验证cookie if($havemood==1){
echo "您已经表达过心情了,保持平常心有益身心健康!";
exit;
}
$field = 'mood'.$mid;
//数据表中的心情字段,分别用Mood0,mood1,mood2...表示不同的心情字段 $query = mysql_query("update mood set ".$field."=".$field."+1 where id=".$id);
//对应的心情字段值+1 if($query){
setcookie("mood".$id, $mid.$id, time()+300);
//设置cookie,为了测试我们设置cookie过期时间为300s $query2 = mySQL_query("select * From mood where id=$id");
$rs = mysql_fetch_array($query2);
//获取该文章的心情数据 $total = $rs['mood0']+$rs['mood1']+$rs['mood2']+$rs['mood3']+$rs['mood4']+$rs['mood5']+ $rs['mood6']+$rs['mood7'];
$height = round(($rs[$field]/$total)*$moodpicheight);
//得到总量,并计算当前对应心情的柱状图的高度 echo $height;
//返回当前心情柱状的高度 }
else{
echo -1;
//数据出错 }
获取心情:
$mname = explode(',',$moodname);
//心情说明 $num = count($mname);
$mpic = explode(',',$moodpic);
//心情图标 $id = (int)$_GET['id'];
//文章或帖子id $query = mysql_query("select * from mood where id=$id");
//查询对应的心情数据 $rs = mysql_fetch_array($query);
if($rs){
//得到发表心情的总量 $total = $rs['mood0']+$rs['mood1']+$rs['mood2']+$rs['mood3']+$rs['mood4']+ $rs['mood5']+$rs['mood6']+$rs['mood7'];
for($i=0;
$i$num;
$i++){
$field = 'mood'.$i;
//字段名 $m_val = intval($rs[$field]);
//心情对应的值(次数) $height = 0;
//柱图高度 if($total &
&
$m_val){
$height=round(($m_val/$total)*$moodpicheight);
//计算高度 }
$arr[] = array( 'mid' =>
$i, //对应心情id 'mood_name' =>
$mname[$i], //心情名称 'mood_pic' =>
$mpic[$i], //图标 'mood_val' =>
$m_val, //次数 'height' =>
$height //柱状图高度 );
}
echo json_encode($arr);
//返回JSON数据 }
获取心情列表信息,并展示在页面中:
$(function(){
$.ajax({
tyPE: 'GET', //通过get方式发送请求 url: 'ajax.php', //目标地址 cache: false, //不缓存数据,注意文明发表心情的数据是实时的,需将cache设置为false,默认是true data: 'id=1', //参数,对应文章或帖子的id,本例中固定为1,实际应用中是获取当前文章或帖子的id dataType: 'json', //数据类型为JSON error: function(){
alert('出错了!');
}
, success: function(json){
//请求成功后 if(json){
$.each(json,function(index,array){
//遍历json数据列 VAR str = "li>
span>
"+array['mood_val']+"/span>
div class=\"pillar\" style=\"height:"+array['height']+"px;
\">
/div>
div class=\"face\" rel=\""+array['mid']+"\">
img src=\"images/"+array['mood_pic']+"\">
br/>
"+array['mood_name']+"/div>
/li>
";
$("#mood ul").append(str);
//将数据加入到#mood ul列表中 }
);
}
}
}
);
... }
);
数据库表建立直接运行以下代码:
CREATE TABLE IF NOT EXISTS `mood` ( `id` int(11) NOT NULL, `mood0` int(11) NOT NULL DEFAULT '0', `mood1` int(11) NOT NULL DEFAULT '0', `mood2` int(11) NOT NULL DEFAULT '0', `mood3` int(11) NOT NULL DEFAULT '0', `mood4` int(11) NOT NULL DEFAULT '0', `mood5` int(11) NOT NULL DEFAULT '0', `mood6` int(11) NOT NULL DEFAULT '0', `mood7` int(11) NOT NULL DEFAULT '0', Primary KEY (`id`) ) ENginE=MyISAM DEFAULT CHARSET=utf8;
INSERT INTO `mood` (`id`, `mood0`, `mood1`, `mood2`, `mood3`, `mood4`, `mood5`, `mood6`, `mood7`) VALUES(1, 8, 6, 20, 16, 6, 9, 15, 21);
更多相关php知识,请访问php教程!
以上就是PHP+Ajax实现文章心情投票功能(代码实例)的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: PHP+Ajax实现文章心情投票功能(代码实例)
本文地址: https://pptw.com/jishu/596207.html
