首页 / 网页编程 / PHP / PHP+MySql+jQuery实现的"顶"和"踩"投票功能

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 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> 

.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} 

$（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"）;}}）; } 

include_once（"connect.php"）;//连接数据库$action = $_GET["action"]; $id = 1; $ip = get_client_ip（）;//获取ipif（$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）; }