目录
PHP+MySql+jQuery实现的"顶"和"踩"投票功能,mysqljquery
首页 后端开发 php教程 PHP+MySql+jQuery实现的"顶"和"踩"投票功能,mysqljquery_PHP教程

PHP+MySql+jQuery实现的"顶"和"踩"投票功能,mysqljquery_PHP教程

Jul 12, 2016 am 08:50 AM
jquery mysql php 投票

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

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

数据库操作:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

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:

1

2

3

4

5

6

7

8

9

10

11

12

13

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

$(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&#63;action=like",1);

 });

 //单击“踩”时

 $("#dig_down").click(function(){

 getdata("do.php&#63;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:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

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&#63;'您已经顶过了':'您已经踩过了';

 $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程序设计有所帮助。

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/1133114.htmlTechArticlePHP+MySql+jQuery实现的"顶"和"踩"投票功能,mysqljquery 本文实例为大家分享了基于PHP+jQuery+MySql实现红蓝(顶踩)投票代码,供大家参考,具体内容...
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1677
14
CakePHP 教程
1431
52
Laravel 教程
1334
25
PHP教程
1279
29
C# 教程
1257
24
session_start()函数的意义是什么? session_start()函数的意义是什么? May 03, 2025 am 12:18 AM

session_start()iscucialinphpformanagingusersessions.1)ItInitiateSanewsessionifnoneexists,2)resumesanexistingsessions,and3)setsasesessionCookieforContinuityActinuityAccontinuityAcconActInityAcconActInityAcconAccRequests,EnablingApplicationsApplicationsLikeUseAppericationLikeUseAthenticationalticationaltication and PersersonalizedContentent。

作曲家:PHP开发人员的软件包经理 作曲家:PHP开发人员的软件包经理 May 02, 2025 am 12:23 AM

Composer是PHP的依赖管理工具,通过composer.json文件管理项目依赖。1)解析composer.json获取依赖信息;2)解析依赖关系形成依赖树;3)从Packagist下载并安装依赖到vendor目录;4)生成composer.lock文件锁定依赖版本,确保团队一致性和项目可维护性。

与其他关系数据库相比,使用MySQL的优点是什么? 与其他关系数据库相比,使用MySQL的优点是什么? May 01, 2025 am 12:18 AM

MySQL被广泛应用于各种项目中的原因包括:1.高性能与可扩展性,支持多种存储引擎;2.易于使用和维护,配置简单且工具丰富;3.丰富的生态系统,吸引大量社区和第三方工具支持;4.跨平台支持,适用于多种操作系统。

MySQL与Oracle:了解许可和成本 MySQL与Oracle:了解许可和成本 May 03, 2025 am 12:19 AM

MySQL采用GPL和商业许可,适合小型和开源项目;Oracle采用商业许可,适合需要高性能的企业。MySQL的GPL许可免费,商业许可需付费;Oracle许可费用按处理器或用户计算,成本较高。

MySQL与PhpMyAdmin:了解关键差异 MySQL与PhpMyAdmin:了解关键差异 May 06, 2025 am 12:17 AM

MySQL是数据库管理系统,phpMyAdmin是管理MySQL的Web工具。1.MySQL用于存储和管理数据,支持SQL操作。2.phpMyAdmin提供图形界面,简化数据库管理。

Navicat和Mysql:完美的合作伙伴关系 Navicat和Mysql:完美的合作伙伴关系 May 05, 2025 am 12:09 AM

Navicat和MySQL是绝配,因为它们能提高数据库管理和开发效率。1.Navicat简化了MySQL的操作,通过图形界面和自动生成SQL语句提升工作效率。2.Navicat支持多种连接方式,方便本地和远程管理。3.它提供了强大的数据迁移和同步功能,适合高级用法。4.Navicat有助于性能优化和最佳实践,如定期备份和查询优化。

PHP性能优化策略。 PHP性能优化策略。 May 13, 2025 am 12:06 AM

phpapplicationscanbeoptimizedForsPeedAndeffificeby:1)启用cacheInphp.ini,2)使用preparedStatatementSwithPdoforDatabasequesies,3)3)替换loopswitharray_filtaray_filteraray_maparray_mapfordataprocrocessing,4)conformentnginxasaseproxy,5)

MySQL:SQL的实际应用 MySQL:SQL的实际应用 May 08, 2025 am 12:12 AM

MySQL受欢迎的原因是其性能卓越且易于使用和维护。1.创建数据库和表:使用CREATEDATABASE和CREATETABLE命令。2.插入和查询数据:通过INSERTINTO和SELECT语句操作数据。3.优化查询:使用索引和EXPLAIN语句提升性能。

See all articles