Ausführliche Erläuterung von Lotterieprogrammbeispielen mit jQuery, PHP und MySQL

Dieser Artikel stellt hauptsächlich jQuery+PHP+Mysql vor, um das Lotterieprogramm im Detail zu implementieren. Ich hoffe, dass es jedem helfen kann.

Lotterieprogramme sind im wirklichen Leben weit verbreitet und aufgrund unterschiedlicher Anwendungsszenarien sind auch die Lotteriemethoden vielfältig. In diesem Artikel wird anhand von Beispielen erläutert, wie Sie mit jQuery+PHP+MySQL ein einfaches Lotterieprogramm implementieren, das dem häufig im Fernsehen gezeigten ähnelt.

Demo ansehen

Das Lotterieprogramm in diesem Beispiel besteht darin, jeweils eine Zahl zufällig aus einer Zahl auszuwählen Eine große Anzahl von Mobiltelefonnummern kann mehrmals gezogen werden, und die gezogene Zahl wird nicht erneut gezogen. Lotterievorgang: Nach dem Klicken auf die Schaltfläche „Start“ ruft das Programm die Zahleninformationen ab und scrollt, um die Zahlen anzuzeigen. Wenn Sie auf die Schaltfläche „Stopp“ klicken, wird das Scrollen der Zahlen gestoppt Sie können auf die Schaltfläche „Start“ klicken, um die Lotterie fortzusetzen.

HTML

<p id="roll"></p><input type="hidden" id="mid" value=""> 
<p><input type="button" class="btn" id="start" value="开始"> 
<input type="button" class="btn" id="stop" value="停止"></p> 
<p id="result"></p>

Im obigen Code benötigen wir ein #roll, um die fortlaufende Zahl anzuzeigen. #mid wird verwendet, um die ID der gezogenen Zahl aufzuzeichnen, und dann werden zwei Schaltflächen zum „Starten“ bzw. „Stoppen“ von Aktionen benötigt. Schließlich wird ein #result benötigt, um das Ergebnis der Ziehung anzuzeigen.

CSS

Wir verwenden einfaches CSS, um die HTML-Seite zu dekorieren.

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

Beachten Sie, dass wir die Schaltfläche #stop standardmäßig auf display:none eingestellt haben, sodass am Anfang nur die Schaltfläche „Start“ angezeigt wird. „Start“: Während die Lotterie läuft, wird die Schaltfläche „Stopp“ angezeigt.

jQuery

Das erste, was wir erreichen müssen, ist, auf die Schaltfläche „Start“ zu klicken und die Daten für die Lotterie aus dem Hintergrund über Ajax abzurufen. Das heißt, die Mobiltelefonnummer, und verwenden Sie dann das Timing, um die Mobiltelefonnummern anzuzeigen. Beachten Sie, dass die angezeigten Mobiltelefonnummern zufällig sind, das heißt, sie werden nicht in einer bestimmten Reihenfolge angezeigt Folgender Code:

$(function(){ 
  var _gogo; 
  var start_btn = $("#start"); 
  var stop_btn = $("#stop"); 
   
  start_btn.click(function(){ 
    $.getJSON('data.php',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]['id']; //随机id 
          var v = obj[num]['mobile']; //对应的随机号码 
          $("#roll").html(v); 
          $("#mid").val(id); 
        },100); //每隔0.1秒执行一次 
        stop_btn.show(); 
        start_btn.hide(); 
      }else{ 
        $("#roll").html('系统找不到数据源，请先导入数据。'); 
      } 
    }); 
  }); 
});

Zuerst definieren wir Variablen, um nachfolgende Aufrufe zu erleichtern. Wenn dann auf die Schaltfläche „Start“ geklickt wird, sendet die Seite eine Ajax-Anfrage an den Hintergrund data.php. Hier verwenden wir jqeurys getJSON, um die asynchrone Anfrage abzuschließen. Wenn der Hintergrund JSON-Daten zurückgibt, können wir die JSON-Zeichenfolge über die Funktion eval() in das Objekt obj konvertieren, die die JSON-Daten tatsächlich in ein Array konvertiert. Zu diesem Zeitpunkt verwenden wir setInterval, um einen Timer zu erstellen. Die Arbeit, die im Timer ausgeführt werden muss, besteht darin, die Mobiltelefonnummerninformationen im Array obj zufällig abzurufen und sie dann auf der Seite anzuzeigen. Lassen Sie dann den Timer alle 0,1 laufen, um so den Effekt eines Scrollens der Lottozahlen zu erzielen. Gleichzeitig wird die Schaltfläche „Stopp“ angezeigt und die Schaltfläche „Start“ ausgeblendet. Zu diesem Zeitpunkt läuft die Lotterie.

Der nächste Schritt besteht darin, sich den Arbeitsaufwand für die Aktion „Stopp“ anzusehen.

  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(); 
    }); 
  });

Wenn Sie auf die Schaltfläche „Stopp“ klicken, bedeutet dies, dass die Lotterie beendet ist. Verwenden Sie die Funktion „clearInterval()“, um den Timer zu stoppen, die ID der gezogenen Zahl abzurufen und dann die ID der ausgewählten Zahl zur Verarbeitung über $.post an den Hintergrund data.php zu senden. Die Zahl, die gezogen werden soll, muss in der Datenbank markiert werden. Wenn die Hintergrundverarbeitung erfolgreich ist, fügt das Frontend die Gewinnzahl zu den Gewinnergebnissen hinzu, blendet die Schaltfläche „Stopp“ aus und zeigt die Schaltfläche „Start“ an, und Sie können erneut zeichnen.

Beachten Sie, dass wir setInterval() und clearInterval() verwenden, um den Timer einzustellen und den Timer zu stoppen. Sie können auf Google oder Baidu nach der Verwendung dieser beiden Funktionen suchen.

PHP

data.php muss zunächst zwei Dinge tun: Lesen Sie zunächst die Informationen zur Mobiltelefonnummer, indem Sie eine Verbindung zur Datenbank herstellen (ohne die Gewinnzahlen). ) und geben Sie es dann durch Konvertieren in das JSON-Format an das Front-End aus. Zweitens ändern Sie durch den Empfang der Front-End-Anfrage den Status der Gewinnnummer in der entsprechenden Datenbank, was bedeutet, dass die Nummer den Preis gewonnen hat und nicht beim nächsten Mal nicht mehr als Lottozahl verwendet werden.

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

Wir können sehen, dass es im Datentabellenmitglied ein Feld namens Status gibt. Dieses Feld wird verwendet, um zu identifizieren, ob der Preis gewonnen wurde. 1 bedeutet, dass Sie den Preis gewonnen haben, 0 bedeutet, dass Sie den Preis nicht gewonnen haben. Dieses Hintergrund-PHP-Programm betreibt die Datenbank und gibt dann die entsprechenden Informationen an das Frontend zurück.

MYSQL

Fügen Sie abschließend die Strukturinformationen der Mitgliedstabelle hinzu.

CREATE TABLE `member` ( 
 `id` int(11) NOT NULL auto_increment, 
 `mobile` varchar(20) NOT NULL, 
 `status` tinyint(1) NOT NULL default '0', 
 PRIMARY KEY (`id`) 
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

In Bezug auf das Lotterieprogramm gibt es je nach den unterschiedlichen Anforderungen verschiedener Anwendungen unterschiedliche Ausdrucksformen. Als nächstes werden wir einen Artikel veröffentlichen, der beschreibt, wie man das Lotterieprogramm mit unterschiedlichen Wahrscheinlichkeiten umsetzt.

Verwandte Empfehlungen:

Beispiele für die Implementierung von Lotterieprogrammen in PHP, jQuery und MySQL

Code-Sharing für einfache JavaScript-Lotterieprogrammimplementierung

JS-Jahrestreffen-Lotterieprogramm

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung von Lotterieprogrammbeispielen mit jQuery, PHP und MySQL. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!