Exemples d'implémentation d'un programme de loterie avec php, jQuery et Mysql

黄舟
Libérer: 2023-03-17 14:50:01
original
2104 Les gens l'ont consulté

Dans l'article précédent, nous vous avons présenté l'algorithme de probabilité de gain du programme de loterie implémenté en PHP. Nous savons également que les programmes de loterie sont souvent rencontrés dans notre travail, nous allons donc vous présenter aujourd'hui l'implémentation de PHP, jQuery et. Mysql. Exemples de programmes de loterie !

Le programme de loterie dans cet exemple consiste à sélectionner au hasard un numéro parmi un grand nombre de numéros de téléphone portable comme numéro gagnant. Il peut être tiré plusieurs fois, et le numéro tiré ne sera plus tiré. Processus de loterie : après avoir cliqué sur le bouton "Démarrer", le programme obtient les informations sur le numéro et fait défiler pour afficher les numéros. Lorsque vous cliquez sur le bouton "Arrêter", les numéros arrêtent de défiler. Le numéro affiché à ce moment est le numéro gagnant. pouvez cliquer sur le bouton "Démarrer" pour continuer la loterie.

HTML

<div id="roll">
</div>
<input type="hidden" id="mid" value=""> 
<p>
<input type="button" class="btn" id="start" value="开始">  
<input type="button" class="btn" id="stop" value="停止">
</p> <div id="result"></div>
Copier après la connexion

Dans le code ci-dessus, nous avons besoin d'un #roll pour afficher le numéro roulant, #mid est utilisé pour enregistrer l'ID du numéro tiré , puis Il nécessite deux boutons pour "démarrer" et "arrêter" les actions respectivement, et enfin un #result est nécessaire pour afficher les résultats de la loterie.

CSS

Nous utilisons du CSS simple pour décorer la page html.

.demo{width:300px; margin:60px auto; text-align:center} 
#roll{height:32px; line-height:32px; font-size:24px; color:#f30} 
.btn{width:80px; height:26px; line-height:26px; background:url(btn_bg.gif) 
 repeat-x; border:1px solid #d3d3d3; cursor:pointer} 
#stop{display:none} 
#result{margin-top:20px; line-height:24px; font-size:16px; text-align:center}
Copier après la connexion

Notez que nous avons défini le bouton #stop pour afficher : aucun par défaut afin que seul le bouton "Démarrer" soit affiché au début. Après avoir cliqué sur "Démarrer", le bouton "Arrêter" sera affiché. être affiché pendant que la loterie est en cours.

jQuery

La première chose que nous devons réaliser est de cliquer sur le bouton "Démarrer", d'obtenir les données de la loterie en arrière-plan via ajax, c'est-à-dire le numéro de téléphone mobile, puis affichez le téléphone mobile via un défilement programmé. Veuillez noter que le numéro de téléphone mobile affiché à chaque fois est aléatoire, c'est-à-dire qu'il n'apparaît pas dans un certain ordre. Regardons le code suivant :

$(function(){ 
    var _gogo; 
    var start_btn = $("#start"); 
    var stop_btn = $("#stop"); 
     
    start_btn.click(function(){ 
        $.getJSON(&#39;data.php&#39;,function(json){ 
            if(json){ 
                var obj = eval(json);//将JSON字符串转化为对象 
                var len = obj.length; 
                _gogo = setInterval(function(){ 
                    var num = Math.floor(Math.random()*len);//获取随机数 
                    var id = obj[num][&#39;id&#39;]; //随机id 
                    var v = obj[num][&#39;mobile&#39;]; //对应的随机号码 
                    $("#roll").html(v); 
                    $("#mid").val(id); 
                },100); //每隔0.1秒执行一次 
                stop_btn.show(); 
                start_btn.hide(); 
            }else{ 
                $("#roll").html(&#39;系统找不到数据源,请先导入数据。&#39;); 
            } 
        }); 
    }); 
});
Copier après la connexion

Nous définissons d'abord la variable , pratique pour les appels ultérieurs. Ensuite, lorsque vous cliquez sur le bouton "Démarrer", la page envoie une requête Ajax au data.php en arrière-plan. Ici, nous utilisons getJSON de jqeury pour terminer la requête asynchrone. Lorsque l'arrière-plan renvoie des données json, nous pouvons convertir la chaîne JSON en objet obj via la fonction eval(), qui convertit en fait les données json en un tableau. À l'heure actuelle, nous utilisons setInterval pour créer un minuteur. Le travail à effectuer dans le minuteur consiste à obtenir aléatoirement les informations sur le numéro de téléphone portable dans le tableau obj, puis à les afficher sur la page. Exécutez ensuite la minuterie tous les 0,1, obtenant ainsi l'effet de faire défiler les numéros de loterie. En même temps, le bouton « Stop » est affiché et le bouton « Start » est masqué. A ce moment, la loterie est en cours.

L'étape suivante consiste à examiner le travail requis pour l'action "Stop".

stop_btn.click(function(){ 
        clearInterval(_gogo); 
        var mid = $("#mid").val(); 
        $.post("data.php?action=ok",{id:mid},function(msg){ 
            if(msg==1){ 
                var mobile = $("#roll").html(); 
                $("#result").append("<p>"+mobile+"</p>"); 
            } 
            stop_btn.hide(); 
            start_btn.show(); 
        }); 
    });
Copier après la connexion

Lorsque vous cliquez sur le bouton "Stop", cela signifie que la loterie est terminée. Utilisez la fonction clearInterval() pour arrêter le chronomètre, obtenir l'ID du numéro tiré, puis envoyer l'ID du numéro sélectionné au background data.php pour traitement via $.post. Le numéro qui doit être tiré doit être marqué dans la base de données. Si le traitement en arrière-plan réussit, le frontal ajoutera le numéro gagnant aux résultats gagnants, masquera le bouton « Stop » et affichera le bouton « Démarrer », et vous pourrez à nouveau dessiner.

Notez que nous utilisons setInterval() et clearInterval() pour régler la minuterie et arrêter la minuterie. Vous pouvez rechercher sur Google ou Baidu l'utilisation de ces deux fonctions.

PHP

data.php doit faire deux choses. Tout d'abord, connectez-vous à la base de données via et lisez les informations sur le numéro de téléphone mobile (pas emballé) numéro gagnant), puis l'afficher sur le front-end en le convertissant au format json ; deuxièmement, en recevant la requête front-end, modifier le statut du numéro gagnant dans la base de données correspondante, ce qui signifie que le numéro a gagné le prix et ne sera plus utilisé comme numéro de loterie la prochaine fois.

include_once(&#39;connect.php&#39;); //连接数据库 
 
$action = $_GET[&#39;action&#39;]; 
if($action==""){ //读取数据,返回json 
    $query = mysql_query("select * from member where status=0"); 
        while($row=mysql_fetch_array($query)){ 
        $arr[] = array( 
            &#39;id&#39; => $row[&#39;id&#39;], 
            &#39;mobile&#39; => substr($row[&#39;mobile&#39;],0,3)."****".substr($row[&#39;mobile&#39;],-4,4) 
        ); 
    } 
    echo json_encode($arr); 
}else{ //标识中奖号码 
    $id = $_POST[&#39;id&#39;]; 
    $sql = "update member set status=1 where id=$id"; 
    $query = mysql_query($sql); 
    if($query){ 
        echo &#39;1&#39;; 
    } 
}
Copier après la connexion

Nous pouvons voir qu'il y a un champ appelé statut dans le membre de la table de données. Ce champ est utilisé pour identifier si le prix est gagné. 1 signifie que vous avez gagné le prix, 0 signifie que vous n'avez pas gagné le prix. Ce programme php en arrière-plan exploite la base de données puis renvoie les informations correspondantes au front-end.

MYSQL

Enfin, joignez les informations sur la structure de la table membre.

CREATE TABLE `member` ( 
  `id` int(11) NOT NULL auto_increment, 
  `mobile` varchar(20) NOT NULL, 
  `status` tinyint(1) NOT NULL default &#39;0&#39;, 
  PRIMARY KEY  (`id`) 
) ENGINE=MyISAM  DEFAULT CHARSET=utf8;
Copier après la connexion

Résumé :

Cet article décrit en détail le programme de loterie avec php, jQuery et Mysql à travers des exemples, et sur la loterie programme, selon différents besoins de situations d'application auront différentes formes d'expression.

Recommandations associées :

Exemple d'implémentation PHP de l'algorithme de probabilité de gain d'un programme de loterie

Programme de loterie PHP et algorithme de mise en œuvre de publicité aléatoire

Algorithme de probabilité du programme de loterie PHP

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal