所属分类:PHP实例-Ajax
使用方法:
载入CSS样式
<link rel="stylesheet" type="text/css" href="style.css" />
载入jQuery库文件
<script type="text/javascript" src="http://ajax.useso.com/ajax/libs/jquery/1.7.2/jquery.min.js">script>
效果初始化、配置
var lottery = {
index: 0, //当前转动到哪个位置,起点位置
count: 0, //总共有多少个位置
timer: 0, //setTimeout的ID,用clearTimeout清除
speed: 20, //初始转动速度
times: 0, //转动次数
cycle: 50, //转动基本次数:即至少需要转动多少次再进入抽奖环节
prize: 0, //中奖位置
init: function(id) {
if ($("#" + id).find(".lottery-unit").length > 0) {
$lottery = $("#" + id);
$units = $lottery.find(".lottery-unit");
this.obj = $lottery;
this.count = $units.length;
$lottery.find(".lottery-unit-" + this.index).addClass("active");
}
},
roll: function() {
var index = this.index;
var count = this.count;
var lottery = this.obj;
$(lottery).find(".lottery-unit-" + index).removeClass("active");
index += 1;
if (index > count - 1) {
index = 0;
}
$(lottery).find(".lottery-unit-" + index).addClass("active");
this.index = index;
return false;
},
stop: function(index) {
this.prize = index;
return false;
}
};
点击抽奖并且远程ajax.php获取奖项
$(function() {
lottery.init('lottery');
$("#lottery a").click(function() {
if (click) {
return false;
} else {
lottery.speed = 100;
$.post("ajax.php", {
uid: 1
},
function(data) { //获取奖品,也可以在这里判断是否登陆状态
$("#lottery").attr("prize_site", data.prize_site);
$("#lottery").attr("prize_id", data.prize_id);
$("#lottery").attr("prize_name", data.prize_name);
roll();
click = true;
return false;
},
"json")
}
});
})
ajax.php:prize表示奖项内容,v表示中奖几率(若数组中七个奖项的v的总和为100,如果v的值为1,则代表中奖几率为1%,依此类推)
$prize_arr = array(
'0' => array('id' => 1, 'prize' => '一等奖', 'v' => 5),
'1' => array('id' => 2, 'prize' => '二等奖', 'v' => 5),
'2' => array('id' => 3, 'prize' => '三等奖', 'v' => 5),
'3' => array('id' => 4, 'prize' => '四等奖', 'v' => 5),
'4' => array('id' => 5, 'prize' => '五等奖', 'v' => 5),
'5' => array('id' => 6, 'prize' => '六等奖', 'v' => 5),
'6' => array('id' => 7, 'prize' => '七等奖', 'v' => 5),
'7' => array('id' => 8, 'prize' => '八等奖', 'v' => 5),
'8' => array('id' => 9, 'prize' => '九等奖', 'v' => 5),
'9' => array('id' => 10, 'prize' => '十等奖', 'v' => 5),
'10' => array('id' => 11, 'prize' => '十一等奖', 'v' => 25),
'11' => array('id' => 12, 'prize' => '十二等奖', 'v' => 25),
);
PHP后端获取随机奖品
foreach ($prize_arr as $k=>$v) {
$arr[$v['id']] = $v['v'];
}
$prize_id = getRand($arr); //根据概率获取奖项id
foreach($prize_arr as $k=>$v){ //获取前端奖项位置
if($v['id'] == $prize_id){
$prize_site = $k;
break;
}
}
$res = $prize_arr[$prize_id - 1]; //中奖项
$data['prize_name'] = $res['prize'];
$data['prize_site'] = $prize_site;//前端奖项从-1开始
echo json_encode($data);