程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> PHP綜合 >> php+jquery+ajax開發抽獎功能模塊下載

php+jquery+ajax開發抽獎功能模塊下載

編輯:PHP綜合

php+jquery+ajax實現抽獎系統模塊代碼如下:

首頁在抽獎前需要將所有人員的參與名單在屏幕上滾動顯示,所以就用jquery實現了,

1. 參與名單將放在一個txt文件裡面,我將放到 phones.txt:

首先用ajax讀取讀取數據:

<script type="text/javascript">
    $(document).ready(function(){
        var phones;
        var list_phones = '';
        $.ajax({
            url: './get_set.php',
            type: 'POST',
            dataType: 'text',
            data: {'action' : 'get'},
            success: function(data){
                if(data && data != ''){
                    phones = data;
                    phones = phones.split(',');
                    //開始將參與名單滾動
                                                         
                    for(var j=0; j<phones.length; j++){
                        list_phones += phones[j] + '<br />';
                    }
                    var list_content = $('<div />').addClass('list-div').css({'position' : 'relative', 'top' : 0}).html(list_phones);
                    $('#list-phones').append(list_content);
                    //alert($('#list-phones').html());
                    //alert($('.list-div').height());
                }
            }
        });
                                     
        //list-phones : height=3162 - 200;
                                             
        var list_phones_h = 0;
        var list_start = setInterval(
            function(){
                if(parseInt($('.list-div').position().top) < -2962){
                    $('.list-div').animate({top : 0});
                    list_phones_h = 0;
                }
                $('.list-div').animate({top : '-' + list_phones_h + 'px'}, function(){list_phones_h+=34;});
                                                     
                                                     
            }, 1000
        );
                                     
        var start;
        //中獎名單
        var $s = '';
        //獎項
        var jx;
        //是否開始
        var flag = false;
                                             
        $('#start').click(function(){
            start_chou();
        });
                                     
        $('#stop').click(function(){
            stop_chou();
        });
                                     
        $(window).bind('keydown', function(event){
            if(event.keyCode === 32){
                !flag ? start_chou() : stop_chou();
            }
        });
                                     
        //開始抽獎
        function start_chou(){
            if(phones.length == 0){
                $('#texes').val('error: 都抽完了,沒有可參與的抽獎名單了!');
                $('#current').val('');
                return;
            }
            //關閉滾動
            clearInterval(list_start);
            $('#list-phones').detach();
            jx = $("input[name='jx']:checked").val();
            if(!jx || jx == ''){
                $('#texes').val('您還沒有設置本次抽獎獎項!');
                return;
            }
            if(!flag){
                                                     
                //alert(jx);
                $('#current').val('');
                $('#texes').val('正在隨機抽取,請耐心等待......');
                flag = true;            
                setTimeout(function(){
                start = setInterval(function(){
                    $('#rrss').val(function(){
                        var len = phones.length;
                        var rand = Math.floor(Math.random() * len);
                        //console.log(rand);
                        return phones[rand];
                    });
                    $('#current').val(Math.floor(Math.random() * 100000000000000000));
                },1);
                }, 500);
            }
        }
                                     
        //停止抽獎
        function stop_chou(){
            if(flag){
                flag = false;
                clearInterval(start);
                $('#current').val($('#rrss').val());
                if(jx === 'tex'){
                    $s += '特等獎:  ' + $('#current').val() + ',';
                    $('#texes').val('特等獎!');
                }else if(jx === 'one'){
                    $s += '一等獎:  ' + $('#current').val() + ',';
                    $('#texes').val('一等獎!');
                }else if(jx === 'two'){
                    $s += '二等獎:  ' + $('#current').val() + ',';
                    $('#texes').val('二等獎!');
                }else if(jx === 'three'){
                    $s += '三等獎:  ' + $('#current').val() + ',';
                    $('#texes').val('三等獎!');
                }else{
                    $s += '';
                    $('#texes').val('您還沒有設置本次抽獎獎項!');
                }
                //本次抽獎完成後,自動移出本次獲獎名單,不參與之後的抽獎
                getIndex(phones, $('#current').val());
                //將獲獎名單寫入到rs.txt文件中,記錄獲獎名單
                set($s);
                                                     
                //alert($s);
            }
        }
                                     
        function getIndex(arr, val){
            var index = -1;
            for(var i=0; i<arr.length; i++){
                if(arr[i] == val)
                    index = i;
            }
            arr.splice(index, 1);
            //alert(index);
        }
                                     
        //將中獎信息寫入
        function set(rs){
            $.ajax({
                url : 'get_set.php',
                type: 'POST',
                dataType: 'text',
                data: {'action' : 'set', 'rs' : rs},
                success: function(data){return true;}
            });
        }
                                     
        $(document).ready(function(){
            $(window).bind('keydown', function(event){
                if(event.keyCode === 37 || event.keyCode === 38){
                    window.location.href = 'index.html';
                }
            });
        });
    });
</script>

get_set.php文件直接讀取phones.txt文件,將參與名單用“,”連接成字符串,然後利用js的Array split方法分隔成數組. 抽獎時是顯示一些隨機數字,跳動時間為10ms。

get_set.php:

<?php
    if(isset($_POST['action']) && $_POST['action'] == 'get'){
        $file = './phones.txt';
        $phones = '';
        if(file_exists($file) && is_readable($file)){
            $phones = file_get_contents($file);
            $phones = preg_replace('/\\r\\n\s*/', ',', $phones);
        }else{
            die('phones.txt文件不存在或者不可讀');
        }
                                      
        Echo $phones;
        /* Echo '<pre>';
         print_r($phones); */
        //Echo $phones;
    }
                                  
    if(isset($_POST['action']) && $_POST['action'] == 'set'){
                                      
        $rs = $_POST['rs'];
        $data = str_replace(',', "\r\n", $rs);
        $file = './rs.txt';
        file_put_contents($file, $data);
        return true;
    }
?>

中獎的名單將自動寫入到 rs.txt文件,而且中獎後將不再參與下一輪抽獎。

開始抽獎(或者 按 Space空格鍵開始/停止)

*
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved