Examples of implementing lottery program with php, jQuery and Mysql

In the previous article, we introduced to you the winning probability algorithm for implementing lottery programs in PHP. We also know that lottery programs are often encountered in our work, so today we will introduce to you the implementation of PHP, jQuery and Mysql. Examples of lottery programs!

The lottery program in this example is to randomly select one number from a large number of mobile phone numbers as the winning number. It can be drawn multiple times, and the number that is drawn will not be drawn again. Lottery process: After clicking the "Start" button, the program obtains the number information and scrolls to display the numbers. When the "Stop" button is clicked, the numbers stop scrolling. The number displayed at this time is the winning number. You can click the "Start" button to continue the lottery.

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>

In the above code, we need a #roll to display the rolling number, #mid is used to record the ID of the number drawn, and then we need Two buttons are used to "start" and "stop" actions respectively. Finally, a #result is needed to display the lottery results.

CSS

We use simple css to decorate the html page.

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

Note that we set the button #stop to display:none by default so that only the "Start" button will be displayed at the beginning. After clicking "Start" and the lottery is in progress, the "Stop" button will be displayed.

jQuery

The first thing we need to achieve is to click the "Start" button, obtain the data for the lottery from the background through ajax, that is, the mobile phone number, and then display the mobile phone number through scheduled scrolling Number, please note that the mobile phone number displayed each time is random, that is to say, it does not appear in a certain order. Let’s look at the following 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('系统找不到数据源，请先导入数据。'); 
            } 
        }); 
    }); 
});

First wedefine the variable to facilitate the follow-up transfer. Then, when the "Start" button is clicked, the page sends an Ajax request to the background data.php. Here we use jqeury's getJSON to complete the asynchronous request. When the background returns json data, we can convert the JSON string into the object obj through the eval() function, which is actually converting the json data into an array. At this time, we use setInterval to make a timer. The work that needs to be done in the timer is to randomly obtain the mobile phone number information in the array obj, and then display it on the page. Then run the timer every 0.1, thus achieving the effect of scrolling the lottery numbers. At the same time, the "Stop" button is displayed and the "Start" button is hidden. At this time, the lottery is in progress.

Next, let’s look at the work required for the “stop” action.

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

When you click the "Stop" button, it means the lottery is over. Use the clearInterval() function to stop the timer, obtain the ID of the drawn number, and then send the ID of the selected number to the background data.php for processing through $.post. The number that should be drawn needs to be marked in the database. If the background processing is successful, the front-end will add the winning number to the winning results, hide the "Stop" button, and display the "Start" button, and you can draw again.

Note that we use setInterval() and clearInterval() to set the timer and stop the timer. You can search on Google or Baidu for the use of these two functions.

PHP

data.php needs to do two things. First, connect to the database through and read the mobile phone number information (not packaged) winning number), and then output it to the front-end by converting it into json format; second, by receiving the front-end request, modify the winning number status in the corresponding database, which means that the number has won the prize and will no longer be used as the lottery number next time.

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'; 
    } 
}

We can see that there is a field called status in the data table member. This field is used to identify whether the prize is won. 1 means you have won the prize, 0 means you have not won the prize. This background php program operates the database and then returns the corresponding information to the front end.

MYSQL

Finally, attach the member table structure information.

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;

Summary:

This article describes in detail through examples how to implement the lottery program with php, jQuery and Mysql, and about the lottery program, according to different applications Different needs of occasions will have different forms of expression.

Related recommendations:

#php example of implementing lottery program winning probability algorithm

php lottery program and random advertising implementation algorithm

PHP lottery program probability algorithm

The above is the detailed content of Examples of implementing lottery program with php, jQuery and Mysql. For more information, please follow other related articles on the PHP Chinese website!