本站之前有提供過一個簡單易擴(kuò)展、可控性強(qiáng)的Jquery轉(zhuǎn)盤抽獎程序，主要講述了前端實(shí)現(xiàn)抽獎表現(xiàn)的部分，這里給出另一個完整的php轉(zhuǎn)盤抽獎程序，通過使用jQuery和PHP來實(shí)現(xiàn)，用PHP后臺代碼控制抽獎幾率并最終實(shí)現(xiàn)轉(zhuǎn)盤抽獎。

下面簡單說明一下實(shí)現(xiàn)原理，具體請參考下載下來的源碼，非常簡單：

jQuery

當(dāng)點(diǎn)擊“開始抽獎”按鈕后，向后臺php程序lottery.php發(fā)送一個ajax請求，如果請求成功并返回獎項(xiàng)信息，則轉(zhuǎn)動指針，將指針最終指向位置轉(zhuǎn)動到lottery.php返回的角度值。

$.ajax({

type: 'POST',

url: 'lottery.php',

dataType: 'json',

cache: false,

success:function(json){

var a = json.angle; //角度

var p = json.prize; //獎項(xiàng)

$("#startbtn").rotate({

duration:3000, //轉(zhuǎn)動時間間隔(轉(zhuǎn)動速度)

angle: 0, //開始角度

animateTo:1800+a, //轉(zhuǎn)動角度

easing: $.easing.easeOutSine,

callback: function(){

alert('恭喜你，中得'+p+'！');

}

});

},

});

PHP

首先，我們根據(jù)抽獎圓盤上的獎項(xiàng)設(shè)置對應(yīng)角度和中獎幾率，我們在lottery.php中構(gòu)建一個多維數(shù)組

$prize_arr = array(

'0' => array('id'=>1,'min'=>1,'max'=>29,'prize'=>'一等獎','v'=>1),

'1' => array('id'=>2,'min'=>302,'max'=>328,'prize'=>'二等獎','v'=>2),

'2' => array('id'=>3,'min'=>242,'max'=>268,'prize'=>'三等獎','v'=>5),

'3' => array('id'=>4,'min'=>182,'max'=>208,'prize'=>'四等獎','v'=>7),

'4' => array('id'=>5,'min'=>122,'max'=>148,'prize'=>'五等獎','v'=>10),

'5' => array('id'=>6,'min'=>62,'max'=>88,'prize'=>'六等獎','v'=>25),

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

'max'=>array(58,118,178,238,298,358),'prize'=>'七等獎','v'=>50)

);

數(shù)組$prize_arr，id用來標(biāo)識不同的獎項(xiàng)，min表示圓盤中各獎項(xiàng)區(qū)間對應(yīng)的最小角度，max表示最大角度，如一等獎對應(yīng)的最小角度：0，最大角度30，這里我們設(shè)置max值為1、max值為29，是為了避免抽獎后指針指向兩個相鄰獎項(xiàng)的中線。由于圓盤中設(shè)置了多個七等獎，所以我們在數(shù)組中設(shè)置每個七等獎對應(yīng)的角度范圍。prize表示獎項(xiàng)內(nèi)容，v表示中獎幾率，我們會發(fā)現(xiàn)，數(shù)組中七個獎項(xiàng)的v的總和為100，如果v的值為1，則代表中獎幾率為1%，依此類推。

設(shè)置完成各獎品對應(yīng)的概率和在轉(zhuǎn)盤上的角度后，使用PHP隨機(jī)函數(shù)和概率算法計(jì)算出中獎的獎品位置，再把數(shù)據(jù)返回給前端即可(具體請參考源碼)

JQuery + PHP轉(zhuǎn)盤抽獎程序：點(diǎn)擊下載

總結(jié)

以上是生活随笔為你收集整理的jquery php抽奖转盘,JQuery+PHP转盘抽奖程序源码下载的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。