Maison php教程 php手册 php+jQuery实现网络转盘抽奖

php+jQuery实现网络转盘抽奖

Jun 06, 2016 pm 07:58 PM
公司 实现 抽奖 网络 platine

最近公司在搞节日活动,进行抽奖活动,无奈奖品很诱人,但是都是摆设,在网上找了一下,又加上自己的改进 1.新建一个html页面,css样式,布局啥的,网上down的图片 !DOCTYPE HTMLhtmlheadmeta charset=utf-8meta name=keywords content=jquery/meta name=des

最近公司在搞节日活动,进行抽奖活动,无奈奖品很诱人,但是都是摆设,在网上找了一下,又加上自己的改进


php+jQuery实现网络转盘抽奖

1.新建一个html页面,css样式,布局啥的,网上down的图片

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

        <meta charset="utf-8">

        <meta name="keywords" content="jquery">

        <meta name="description" content="抽奖大转盘">

        <title>PHP+JQUERY实现抽奖大转盘</title>

        <script type="text/javascript" src="../../../jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="jQueryRotate.2.2.js"></script>

<script type="text/javascript" src="jquery.easing.min.js"></script>

        <style type="text/css">

                .demo{width:417px;height:417px;position:relative;margin:50px auto}

                #disk{width:417px;height:417px;background:url(disk.jpg) no-repeat;}

                #start{width:163px;height:320px;position:absolute;top:46px;left:130px;}

                #start img{cursor:pointer}

        </style>

        <script type="text/javascript">

                $(function(){

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

                                lottery();

                        });

                });

                function lottery(){

                        $.ajax({

                            type:&#39;POST&#39;,

                            url:&#39;data.php&#39;,

                            dataType:&#39;json&#39;,

                            cache:false,

                            error:function(){

                                alert(&#39;出错啦!&#39;);

                                return false;

                            },

                            success:function(json){

                                    $("#startbtn").unbind(&#39;click&#39;).css("cursor","default");

                                    var a = json.angle; //角度

                                    var p = json.prize; //奖项

                                    $("#startbtn").rotate({

                                        duration:3000, //转动时间

                                        angle: 0,

                                        animateTo:1800+a, //转动角度

                                        easing: $.easing.easeOutSine,

                                        callback: function(){

                                            var con = confirm(&#39;恭喜你,中得&#39;+p+&#39;\n还要再来一次吗?&#39;);

                                            if(con){

                                                lottery();

                                            }else{

                                                return false;

                                            }

                                        }

                                    });

                                }

                            });

                }

        </script>

 

 

        <div class="demo">

                <div id="disk"></div>

                <div id="start"><img  src="/static/imghw/default1.png" data-src="start.png" class="lazy" id="startbtn" alt="php+jQuery实现网络转盘抽奖" ></div>

        </div>

Copier après la connexion

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

<?php $prize_arr=array(

        &#39;0&#39;=>array('id'=&gt;1,'min'=&gt;1,'max'=&gt;29,'prize'=&gt;'一等奖','v'=&gt;1),

        '1'=&gt;array('id'=&gt;2,'min'=&gt;302,'max'=&gt;328,'prize'=&gt;'二等奖','v'=&gt;2),

        '2' =&gt; array('id'=&gt;3,'min'=&gt;242,'max'=&gt;268,'prize'=&gt;'三等奖','v'=&gt;5),

        '3' =&gt; array('id'=&gt;4,'min'=&gt;182,'max'=&gt;208,'prize'=&gt;'四等奖','v'=&gt;7),

        '4' =&gt; array('id'=&gt;5,'min'=&gt;122,'max'=&gt;148,'prize'=&gt;'五等奖','v'=&gt;10),

        '5' =&gt; array('id'=&gt;6,'min'=&gt;62,'max'=&gt;88,'prize'=&gt;'六等奖','v'=&gt;25),

        '6' =&gt; array('id'=&gt;7,'min'=&gt;array(32,92,152,212,272,332),

                                         'max'=&gt;array(58,118,178,238,298,358),'prize'=&gt;'七等奖','v'=&gt;50)

);

 

//概率函数

function getRand($proArr) {

    $result = '';

     //概率数组的总概率精度

    $proSum = array_sum($proArr);

     //概率数组循环

    foreach ($proArr as $key =&gt; $proCur) {

        $randNum = mt_rand(1, $proSum);

        if ($randNum $val){

        $arr[$val['id']]=$val['v'];

}

$id=getRand($arr);//根据概率获取奖项id

$res=$prize_arr[$id-1];

 

$min=$res['min'];

$max=$res['max'];

 

if($res['id']==7){

        $i=mt_rand(0,5);

        $result['angle']=mt_rand($min[$i],$max[$i]);

}else{

        $result['angle']=mt_rand($min,$max);

}

$result['prize']=iconv('gb2312','UTF-8',$res['prize']);

echo json_encode($result);

exit;

?&gt;

Copier après la connexion


Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Que dois-je faire si la Terre s'affiche dans le coin inférieur droit de Windows 10 alors que je ne peux pas accéder à Internet Diverses solutions au problème selon lequel la Terre ne peut pas accéder à Internet dans Win10 ? Que dois-je faire si la Terre s'affiche dans le coin inférieur droit de Windows 10 alors que je ne peux pas accéder à Internet Diverses solutions au problème selon lequel la Terre ne peut pas accéder à Internet dans Win10 ? Feb 29, 2024 am 09:52 AM

Que dois-je faire si la Terre s'affiche dans le coin inférieur droit de Windows 10 alors que je ne peux pas accéder à Internet Diverses solutions au problème selon lequel la Terre ne peut pas accéder à Internet dans Win10 ?

Que se passe-t-il lorsque le réseau ne parvient pas à se connecter au wifi ? Que se passe-t-il lorsque le réseau ne parvient pas à se connecter au wifi ? Apr 03, 2024 pm 12:11 PM

Que se passe-t-il lorsque le réseau ne parvient pas à se connecter au wifi ?

Comment mettre en œuvre la double connexion WeChat sur les téléphones mobiles Huawei ? Comment mettre en œuvre la double connexion WeChat sur les téléphones mobiles Huawei ? Mar 24, 2024 am 11:27 AM

Comment mettre en œuvre la double connexion WeChat sur les téléphones mobiles Huawei ?

Guide de partage de dossiers Windows 11 : partagez facilement vos fichiers et données Guide de partage de dossiers Windows 11 : partagez facilement vos fichiers et données Mar 13, 2024 am 11:49 AM

Guide de partage de dossiers Windows 11 : partagez facilement vos fichiers et données

Comment créer une applet de loterie Excel Comment créer une applet de loterie Excel Mar 20, 2024 am 11:40 AM

Comment créer une applet de loterie Excel

Comment implémenter la fonction de clonage WeChat sur les téléphones mobiles Huawei Comment implémenter la fonction de clonage WeChat sur les téléphones mobiles Huawei Mar 24, 2024 pm 06:03 PM

Comment implémenter la fonction de clonage WeChat sur les téléphones mobiles Huawei

À quelle entreprise appartient l'application Hands ? À quelle entreprise appartient l'application Hands ? Mar 13, 2024 am 11:10 AM

À quelle entreprise appartient l'application Hands ?

Mar 22, 2024 pm 03:41 PM

See all articles