PHP+Mysql实现网站顶和踩投票功能实例
PHP+Mysql实现网站顶和踩投票功能实例,通过记录用户IP,判断用户的投票行为是否有效,该实例也可以扩展到投票系统中。

首先我们在页面上放置“顶”和“踩”的按钮,即#dig_up和#dig_down,按钮上分别记录了投票的票数以及所占的百分比。
<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> $(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("ajax.php",1); //单击“顶”时
$("#dig_up").click(function(){
getdata("ajax.php?action=like",1);
});
//单击“踩”时
$("#dig_down").click(function(){
getdata("ajax.php?action=unlike",1);
});
});
函数getdata()
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");
}
});
}
ajax.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);
}
投票的表结构
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(11) NOT NULL AUTO_INCREMENT,
`vid` int(11) NOT NULL,
`ip` varchar(20) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=3 ;
本文转自:https://www.sucaihuo.com/php/105.html 转载请注明出处!
PHP+Mysql实现网站顶和踩投票功能实例的更多相关文章
- PHP+MySql+jQuery实现的“顶”和“踩”投票功能
index.html <!DOCTYPE HTML><html><head><meta charset="utf-8"><ti ...
- PHP+Ajax实现文章心情投票功能实例
一个PHP+Ajax实现文章心情投票功能实例,可以学习了解实现投票的基本流程:通过ajax获取心情图标及柱状图相关数据,当用户点击其中的一个心情图标时,向Ajax.php发送请求,PHP验证用户coo ...
- web系列教程之php 与mysql 动态网站 。检索 与更新。
接着上次WEb 系列开发之php 与mysql动态网站入门. 个人觉得,学习技术就像一棵大树,主干很重要,枝叶其次.对于学习技术,我们应该分清主次关系.怎么学?为什么要学?有一个较好的分寸. 有时候觉 ...
- InnoSQL HA Suite的实现原理与配置说明 InnoSQL的VSR功能Virtual Sync Replication MySQL 5.5版本引入了半同步复制(semi-sync replicaiton)的功能 MySQL 5.6支持了crash safe功能
InnoSQL HA Suite的实现原理与配置说明 InnoSQL的VSR功能Virtual Sync Replication MySQL 5.5版本引入了半同步复制(semi-sync repl ...
- jsp+servlet+mysql 实现简单的银行登录转账功能
jsp+servlet+mysql 实现简单的银行登录转账功能 [前期的准备] html(登录界面),servlet(处理业务逻辑),jsp(主要实现界面),mysql(实现与数据库的简单的交互)先从 ...
- js上移、下移、置顶、置底功能实现
实现页面上列表内容上移.下移.置顶.置底 功能,主要实现思路是节点操作,比如说:上移,直接把点击项移动到前一个节点,以此类推,当然实际代码实现还要加些判断,如当前点击操作项是否已经是置底或置底了,如果 ...
- 探索 Windows Azure 网站中的自动伸缩功能
去年10月,我们发布了若干针对 WindowsAzure平台的更新,其中一项更新是添加了基于日期的自动伸缩调度支持(在不同的日期设置不同的规则). 在这篇博客文章中,我们将了解自动伸缩的概念,并 ...
- [个人网站搭建]·Django增加评论功能(Python3)
[个人网站搭建]·Django增加评论功能 个人主页--> https://xiaosongshine.github.io/ 个人网站搭建github地址:https://github.com/ ...
- MySQL 在Windows平台上的安装及实例多开
MySQL在Windows平台上的安装及实例多开 by:授客 QQ:1033553122 测试环境 Win7 64 mysql-5.7.20-winx64.zip 下载地址: https://cd ...
随机推荐
- Python实现重命名一个文件夹下的图片
在网上查了一下python实现的图片重命名,工作中刚好用一下. # -*- coding:utf8 -*- import os path = '新建文件夹 (2)/' filelist = os.li ...
- 【PAT甲级】1100 Mars Numbers (20 分)
题意: 输入一个正整数N(<100),接着输入N组数据每组包括一行字符串,将其翻译为另一个星球的数字. AAAAAccepted code: #define HAVE_STRUCT_TIMESP ...
- Python解决RSA加密
最近爬个网站需要用发现密码是通过RSA加密的,因此找网上python加密例子,发现都没有一个比较完整的demo so,自己写一个吧~ 首先,安装相应的库: 1. pyCrypto : pip inst ...
- React项目中遇到的那些坑
1.react中路由跳转后页面不置顶问题 问题: 从页面A跳转到页面B,页面A滚动到中间位置,跳转后页面B也会在中间位置 解决方法:在顶部组件的生命周期中进行判断,例如 componentWillRe ...
- QWidget::setLayout: Attempting to set QLayout "" on xxx "", which already has a layout
QLayout是Qt应用开发中一个非常重要的组件,然而平时使用的时候不小心经常会发现控制台有类似如下的警告: QWidget::setLayout: Attempting to set QLayout ...
- cascadia-code 程序员友好字体
下载地址:https://github.com/microsoft/cascadia-code/releases/download/v1911.21/Cascadia.ttf 下载后右键点击下载的文件 ...
- python学习HTML之CSS
1.sytle属性设置 . <head> <meta charset="UTF-8"> <title>Title</title> & ...
- 13 DFT变换的性质
DFT变换的性质 线性性质 \[ \begin{aligned} y[n]&=ax[n]+bw[n]\xrightarrow{DFT}Y[k]=\sum_{n=0}^{N-1}(ax[n]+ ...
- Spark性能调优-基础篇
前言 在大数据计算领域,Spark已经成为了越来越流行.越来越受欢迎的计算平台之一.Spark的功能涵盖了大数据领域的离线批处理.SQL类处理.流式/实时计算.机器学习.图计算等各种不同类型的计算操作 ...
- 5_6 团体队列(UVa540)<queue与STL其他容器的综合运用>
先给出T个团体,并给出每个团体有多少人和每个人的编号,然后所有团体一起排队,排成一条大队列,排队的原则是,一个成员加入,如果这个成员所在的团体已经有人在排队了,那么他就加到他所在团体的最后面,而不是整 ...