PHP+MySql+jQuery实现的"顶"和"踩"投票功能


Posted in PHP onMay 21, 2016

本文实例为大家分享了基于PHP+jQuery+MySql实现红蓝(顶踩)投票代码,供大家参考,具体内容如下

数据库操作:

CREATE TABLE IF NOT EXISTS `votes` ( 
 `id` int(10) NOT NULL AUTO_INCREMENT, 
 `likes` int(10) NOT NULL DEFAULT '0', 
 `unlikes` int(10) NOT NULL DEFAULT '0', 
 PRIMARY KEY (`id`) 
) ENGINE=MyISAM DEFAULT CHARSET=utf8; 
 
 
INSERT INTO `votes` (`id`, `likes`, `unlikes`) VALUES 
(1, 30, 10); 
 
CREATE TABLE IF NOT EXISTS `votes_ip` ( 
 `id` int(10) NOT NULL, 
 `vid` int(10) NOT NULL, 
 `ip` varchar(40) NOT NULL 
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

div: 

<div class="digg"> 
 <div id="dig_up" class="digup"> 
 <span id="num_up"></span> 
 <p>很好,很强大!</p> 
 <div id="bar_up" class="bar"><span></span><i></i></div> 
 </div> 
 <div id="dig_down" class="digdown"> 
 <span id="num_down"></span> 
 <p>太差劲了!</p> 
 <div id="bar_down" class="bar"><span></span><i></i></div> 
 </div> 
 <div id="msg"></div> 
</div>

css:

.digg{width:420px; height:120px; margin:80px auto 20px auto; position:relative} 
#dig_up,#dig_down{width:200px; height:48px; margin:10px; position:relative; 
border:1px solid #d3d3d3; padding-left:42px; cursor:pointer} 
.digup{background:url(diggs.png) no-repeat 4px 2px;} 
.digup_on{background:url(diggs.png) no-repeat 4px -49px;} 
.digdown{background:url(diggs.png) no-repeat 4px -102px;} 
.digdown_on{background:url(diggs.png) no-repeat 4px -154px;} 
#num_up,#num_down{position:absolute; right:6px; top:18px; font-size:20px;} 
#dig_up p{height:24px; line-height:24px; color:#360} 
#dig_down p{height:24px; line-height:24px; color:#f30} 
.bar{width:100px; height:12px; line-height:12px; border:1px solid #f0f0f0; 
position:relative; text-align:center} 
.bar span{display:block; height:12px; } 
.bar i{position:absolute; top:0; left:104px;} 
#bar_up span{background:#360} 
#bar_down span{background:#f60} 
#msg{position:absolute; right:20px; top:40px; font-size:18px; color:#f00}

jquery:

$(function(){ 
 //鼠标滑向和离开投票按钮时,变换背景样式 
 $("#dig_up").hover(function(){ 
 $(this).addClass("digup_on"); 
 },function(){ 
 $(this).removeClass("digup_on"); 
 }); 
 $("#dig_down").hover(function(){ 
 $(this).addClass("digdown_on"); 
 },function(){ 
 $(this).removeClass("digdown_on"); 
 }); 
 
 //初始化数据 
 getdata("do.php",1); 
 
 //单击“顶”时 
 $("#dig_up").click(function(){ 
 getdata("do.php?action=like",1); 
 }); 
 //单击“踩”时 
 $("#dig_down").click(function(){ 
 getdata("do.php?action=unlike",1); 
 }); 
}); 
 
 
 
---------------------------------------
function getdata(url,sid){ 
 $.getJSON(url,{id:sid},function(data){ 
 if(data.success==1){//投票成功 
  $("#num_up").html(data.like); 
  //通过控制宽度来显示百分比进度条效果 
  $("#bar_up span").css("width",data.like_percent); 
  $("#bar_up i").html(data.like_percent); 
  $("#num_down").html(data.unlike); 
  $("#bar_down span").css("width",data.unlike_percent); 
  $("#bar_down i").html(data.unlike_percent); 
 }else{//投票失败 
  $("#msg").html(data.msg).show().css({'opacity':1,'top':'40px'}) 
  .animate({top:'-50px',opacity:0}, "slow"); 
 } 
 }); 
}

php:

include_once("connect.php");//连接数据库 
 
$action = $_GET['action']; 
$id = 1; 
$ip = get_client_ip();//获取ip 
 
if($action=='like'){//顶 
 likes(1,$id,$ip); 
}elseif($action=='unlike'){//踩 
 likes(0,$id,$ip); 
}else{ 
 echo jsons($id); 
} 
 
------------------------------------
function likes($type,$id,$ip){ 
 $ip_sql=mysql_query("select ip from votes_ip where vid='$id' and ip='$ip'"); 
 $count=mysql_num_rows($ip_sql); 
 if($count==0){//还没有顶过 
 if($type==1){//顶 
  $sql = "update votes set likes=likes+1 where id=".$id; 
 }else{//踩 
  $sql = "update votes set unlikes=unlikes+1 where id=".$id; 
 } 
 mysql_query($sql); 
  
 $sql_in = "insert into votes_ip (vid,ip) values ('$id','$ip')"; 
 mysql_query($sql_in); 
  
 if(mysql_insert_id()>0){ 
  echo jsons($id); 
 }else{ 
  $arr['success'] = 0; 
  $arr['msg'] = '操作失败,请重试'; 
  echo json_encode($arr); 
 } 
 }else{ 
 $msg = $type==1?'您已经顶过了':'您已经踩过了'; 
 $arr['success'] = 0; 
 $arr['msg'] = $msg; 
 echo json_encode($arr); 
 } 
} 
 
 
-----------php-------------------------
 
 
function jsons($id){ 
 $query = mysql_query("select * from votes where id=".$id); 
 $row = mysql_fetch_array($query); 
 $like = $row['likes']; 
 $unlike = $row['unlikes']; 
 $arr['success']=1; 
 $arr['like'] = $like; 
 $arr['unlike'] = $unlike; 
 $like_percent = round($like/($like+$unlike),3)*100; 
 $arr['like_percent'] = $like_percent.'%'; 
 $arr['unlike_percent'] = (100-$like_percent).'%'; 
 
 return json_encode($arr); 
}

以上就是本文的全部内容,希望对大家学习php程序设计有所帮助。

PHP 相关文章推荐
PHP批量生成缩略图的代码
Jul 19 PHP
php adodb连接不同数据库
Mar 19 PHP
PHP字符串函数系列之nl2br(),在字符串中的每个新行 (\n) 之前插入 HTML 换行符br
Nov 10 PHP
php下载文件的代码示例
Jun 29 PHP
zf框架的zend_cache缓存使用方法(zend框架)
Mar 14 PHP
PHP中使用数组指针函数操作数组示例
Nov 19 PHP
Laravel框架中实现使用阿里云ACE缓存服务
Feb 10 PHP
php实现编辑和保存文件的方法
Jul 20 PHP
php实现smarty模板无限极分类的方法
Dec 07 PHP
PHP7扩展开发之hello word实现方法详解
Jan 15 PHP
PHP 对象继承原理与简单用法示例
Apr 21 PHP
PHP笛卡尔积实现原理及代码实例
Dec 09 PHP
制作个性化的WordPress登陆界面的实例教程
May 21 #PHP
详解WordPress中添加友情链接的方法
May 21 #PHP
PHP框架Laravel插件Pagination实现自定义分页
Apr 22 #PHP
屏蔽PHP默认设置中的Notice警告的方法
May 20 #PHP
PHP获取网站中各文章的第一张图片的代码示例
May 20 #PHP
今天你说520了吗?不仅有php表白书还有java表白神器
May 20 #PHP
程序员的表白神器“520”大声喊出来
May 20 #PHP
You might like
MySQL的FIND_IN_SET函数使用方法分享
2012/03/27 PHP
php+ajax导入大数据时产生的问题处理
2014/06/11 PHP
Laravel中使用阿里云OSS Composer包分享
2015/02/10 PHP
php使用文本统计访问量的方法
2016/05/12 PHP
php加密解密字符串示例
2016/10/13 PHP
php 多文件上传的实现实例
2016/10/23 PHP
用js 让图片在 div或dl里 居中,底部对齐
2008/01/21 Javascript
获取HTML DOM节点元素的方法的总结
2009/08/21 Javascript
jquery实现ajax提交form表单的方法总结
2014/03/03 Javascript
js 动态修改css文件的方法
2014/08/05 Javascript
jQuery实现自定义下拉列表
2015/01/05 Javascript
js带点自动图片轮播幻灯片特效代码分享
2015/09/07 Javascript
JS实现仿腾讯微博无刷新删除微博效果代码
2015/10/16 Javascript
基于JavaScript实现移动端TAB触屏切换效果
2015/10/20 Javascript
深入浅析JavaScript中prototype和proto的关系
2015/11/15 Javascript
Bootstrap导航栏各元素操作方法(表单、按钮、文本)
2015/12/28 Javascript
判断JS对象是否拥有某属性的方法推荐
2016/05/12 Javascript
基于JS实现textarea中获取动态剩余字数的方法
2016/05/25 Javascript
让DIV的滚动条自动滚动到最底部的3种方法(推荐)
2016/09/24 Javascript
微信小程序 加载 app-service.js 错误解决方法
2016/10/12 Javascript
javascript 中的事件委托详解
2016/10/25 Javascript
代码详解JS操作剪贴板
2018/02/11 Javascript
新手必须知的Node.js 4个JavaScript基本概念
2018/09/16 Javascript
vuex存值与取值的实例
2019/11/06 Javascript
[02:28]DOTA2亚洲邀请赛附加赛 RECAP赛事回顾
2015/01/29 DOTA
Python高级应用实例对比:高效计算大文件中的最长行的长度
2014/06/08 Python
python实现八大排序算法(2)
2017/09/14 Python
用python爬取租房网站信息的代码
2018/12/14 Python
Pycharm保存不能自动同步到远程服务器的解决方法
2019/06/27 Python
Python爬取某平台短视频的方法
2021/02/08 Python
css3实现图片遮罩效果鼠标hover以后出现文字
2013/11/05 HTML / CSS
Html5实现单张、多张图片上传功能
2019/04/28 HTML / CSS
助学贷款贫困证明
2014/09/23 职场文书
慰问信格式规范
2015/03/23 职场文书
小学教师个人工作总结2015
2015/04/20 职场文书
离婚代理词范文
2015/05/23 职场文书