> 博客详情
摘要: php+jquery实现转盘抽奖 概率可任意调
&php+jquery实现转盘抽奖 概率可任意调
php+jquery实现转盘抽奖 概率可任意调
Posted by: xiaomiao &in Code, PHP 3 Comments
php+jquery实现转盘抽奖
查看DEMO演示
转盘抽奖，炫丽的一般是flash做的。不懂flash而又不需要那么炫丽，可以简单的通过jquery来实现。网上教程有很多，跟着做了一下，也贴出来吧。要实现转盘抽奖，有两个关键点，一是让转盘或指针转起来并控制停止角度，一是概率控制。
对于转起来控制停止角度这个问题，网上各教程都是用的jqueryrotate这个jquery插件，兼容性好使用也简单，要我本人自己写也不知道怎么写好，还是拿来即可。对于概率控制，网上也一致的是这个经典算法：
function getRand($proArr) {
$result = '';
//概率数组的总概率精度
$proSum = array_sum($proArr);
//概率数组循环
foreach ($proArr as $key =& $proCur) {
$randNum = mt_rand(1, $proSum);
if ($randNum &= $proCur) {
$result = $
$proSum -= $proC
unset ($proArr);
这里参数是一个概率数组，某一项的出现的概率是其概率精度/总概率精度。比如概率数组是array(’1′=&’40′,’2′=&’60′)，那么‘1’这一项出现的概率就是40/(40+60)。为什么是这个结果呢，好吧，简单的概率计算：
php经典概率算法解析
php经典概率算法解析
（原谅我为了输这分数，还去百度了一下，囧…）
对于概率数组的来源，实际应用中应该是从数据库里面取，这样方便做各种业务判断，比如某一奖项的概率除了人工干预还根据抽中次数自动变化。我这里为了显示，就写到一个数组里面，而且这找的转盘素材同一奖项还有多处出现，故用这样一个数组来存储（这里根据实际业务而定，不是重点）。
//奖项数据
$prize_arr=array(
'youpan'=&array('angle'=&array('16-40','196-220'),'prize'=&'U盘1个','v'=&10),
'money_2000'=&array('angle'=&array('46-74','170-194'),'prize'=&'2000元代金卷','v'=&5),
'chong_10'=&array('angle'=&array('80-104','226-250'),'prize'=&'10元充值卡','v'=&10),
'money_1000'=&array('angle'=&array('110-134','256-284'),'prize'=&'1000元代金卷','v'=&15),
'flower'=&array('angle'=&array('144-164','286-306'),'prize'=&'鲜花1朵，继续努力','v'=&45),
'chong_50'=&array('angle'=&array('316-340'),'prize'=&'50元充值卡','v'=&5),
'book'=&array('angle'=&array('0-10','346-359'),'prize'=&'书1本','v'=&10),
angel是角度，最小角度与最大角度用‘-’隔开，有多个。这个角度是控制转盘或指针最终停下来时离起点的角度，范围是0~360。根据实际素材而定，我这找的图不规则，作图的人坑爹，调了多次才得到比较精准的角度。v则是概率。
根据上面的奖项设定，通过下面的函数返回转动信息到前台：
//获得旋转信息
function getRotate($prize_arr) {
$data=array();
$option=$_GET;//根据前台的选择更改原定默认概率
foreach($prize_arr as $k=&&$v) {
$v['v']=$option[$k];
$prize=getPrize($prize_arr);//通过概率原理设计函数获得其中一个奖项
$angle=$prize['angle'];
shuffle($angle);//打乱角度数组
$angle=$angle[0];
$angle_arr=explode('-',$angle);
$min=$angle_arr[0];
$max=$angle_arr[1];
$angle=mt_rand($min,$max);
$data['angle']=$
$data['message']=$prize['prize'];
$data['duration']=mt_rand(2,5)*1000;
$data['n']=mt_rand(3,6);//为了不那么单调，随机一下转动时间和转动圈数
echo json_encode($data);
至此后端的程序完毕。前端还得有个调整概率的功能，脑子里想到的就是滑动条，html5有这个特性，但样式简单也兼容性也有问题。百度了一下知道jqueryui有相关控件，但不怕笑话作为新人还没用过jqueryui，无意发现了noUiSlider这个专为不使用jqueryui实现滑动条而生的插件，短小精悍。最近又瞄了瞄BootStrap，顺手又拿来排版一下这前端页面，好吧，基本没用到它的什么东西。
现在时间凌晨1：52，夜已深，后面继续。。。
23:13，继续。
对于改变概率值，上边说了使用noUiSlider，用法可以到官网查看：
$(".youpan").noUiSlider({
start:[10],//起始值
range:{//范围
connect:'lower',//写上左边就变色
serialization: {
target: $('#youpan')//数值在哪里显示
decimals: 0,//数值保留几位小数
在页面加载函数里边给每个需要滑动的元素绑定以上事件即可。更改各项值放在一个form表单，点击开始抽奖收集表单的信息ajax发送到后台计算出具体的旋转信息，再进行转动抽奖。发送ajax的函数如下：
function getPrize() {
var result=
var option=$("#myform").serialize();
url:"03.php",
type:"GET",
data:option,
dataType:"json",
cache:false,
async:false,//同步，否则无法把后台信息信息捕获
error:function(){
alert('出错了');
success:function(data){
接下来是关键的根据后台的信息进行转动并控制停止角度，主要是jqueryrotate的用法，详细的可以点击上边高亮的链接查看。下边也有注释：
function rotate() {
$("#start").css("cursor","pointer");
$("#start").rotate({
click:function(){
$(this).unbind('click').css("cursor","default");//取消点击事件
var value=getPrize();
var effect=$("#select").val();
$(this).rotate({
duration:value.duration,//多少毫秒内完成转动
angle:0,//起始角度
animateTo:value.n*360+value.angle,//一共转动多少角度
easing:eval(effect),//转动动画扩展
callback:function(){//结束时的回调函数
alert(value.message);
转动动画那里，注意得eval()一下，否则得到的只是一个字符串不是动画函数。这个动画也是用的jQuery Easing这个插件，插件再借用插件，很常见的事，什么都自己写，是很不现实的，童鞋。这些动画效果用在这里有一两个动不了，不知为何。把这个rotate函数放到页面加载函数中，在页面加载完毕即可进行转动抽奖。点击之后取消点击事件，是为了防止转动过程中或者抽完一次后继续点击。当然我这里有“再来一发”就是给再绑上。具体看业务需要，怎么搞都行。
至此，一个简单的转盘抽奖就完成了，虽然简陋了点但也能满足一般的业务需要。有什么问题或者改进意见，欢迎各位看官提出。^~^
鉴于有同学说不懂03.php里边的内容，顺便贴出来吧。按需修改。
//奖项数据
$prize_arr=array(
& & 'youpan'=&array('angle'=&array('16-40','196-220'),'prize'=&'U盘1个','v'=&10),
& & 'money_2000'=&array('angle'=&array('46-74','170-194'),'prize'=&'2000元代金卷','v'=&5),
& & 'chong_10'=&array('angle'=&array('80-104','226-250'),'prize'=&'10元充值卡','v'=&10),
& & 'money_1000'=&array('angle'=&array('110-134','256-284'),'prize'=&'1000元代金卷','v'=&15),
& & 'flower'=&array('angle'=&array('144-164','286-306'),'prize'=&'鲜花1朵，继续努力','v'=&45),
& & 'chong_50'=&array('angle'=&array('316-340'),'prize'=&'50元充值卡','v'=&5),
& & 'book'=&array('angle'=&array('0-10','346-359'),'prize'=&'书1本','v'=&10),
//根据奖项数据获得具体奖项
function getPrize($prize_arr) {
& & $proSum=0;
& & foreach($prize_arr as $v){
& & & & $proSum+=$v['v'];
& & foreach($prize_arr as $k=&$v){
& & & & $randNum=mt_rand(1,$proSum);//随机数
& & & & if($randNum&=$v['v']) {
& & & & & & return $v;
& & & & }else{
& & & & & & $proSum-=$v['v'];
//获得旋转信息
function getRotate($prize_arr) {
& & $data=array();
& & $option=$_GET;
& & foreach($prize_arr as $k=&&$v) {
& & & & $v['v']=$option[$k];
& & $prize=getPrize($prize_arr);
& & $angle=$prize['angle'];
& & shuffle($angle);//打乱
& & $angle=$angle[0];
& & $angle_arr=explode('-',$angle);
& & $min=$angle_arr[0];
& & $max=$angle_arr[1];
& & $angle=mt_rand($min,$max);
& & $data['angle']=$
& & $data['message']=$prize['prize'];
& & $data['duration']=mt_rand(2,5)*1000;
& & $data['n']=mt_rand(3,6);
& & echo json_encode($data);
& & //echo json_encode($option);
支付宝支付
微信扫码支付
打赏金额: ￥
已支付成功
打赏金额: ￥这是一个转盘游戏的数字,当三个数字中有数字是相同的时,就算甲赢,否则就算乙赢,请判断这个游戏是否公平.,准备如图三个可以
这是一个转盘游戏的数字,当三个数字中有数字是相同的时,就算甲赢,否则就算乙赢,请判断这个游戏是否公平.,准备如图三个可以自由转动的转盘,甲乙两人中甲转动转盘,乙记录转盘停下时指针所指
不好意思,题目没看懂.能重发一遍么?
我有更好的回答：
剩余:2000字
与《这是一个转盘游戏的数字,当三个数字中有数字是相同的时,就算甲赢,否则就算乙赢,请判断这个游戏是否公平.,准备如图三个可以》相关的作业问题
P＝（360°-180°-90°-50°）/360°=40°/360°=1/9
很急!非常急! 再问： 怎么才4个格？ 再答： 是六个格，两个90度的角，四个45度的角
甲乙丙三位同学向班级图书角捐献一些图书,甲捐的是乙的2倍,丙献的比乙的少如果全加起来,得数是一个不超过50的质数,且各位数字之和是11.甲乙丙三位同学各捐书多少本?三人共捐书多少本?得数是一个不超过50的质数,且各位数字之和是11这个数是47如果丙捐献5本,则乙捐献（47-5）÷（1+2）=42÷3=14本甲捐献14×
1.前37张选票时发现甲得了17张,乙5张,则丙得15张,共（45－5）/2＝20,大于20张才能当选,则甲再得4张能保证当选.2.设正方形的连长为X,则（18－2X）与（14－2X）与X的值越接近,他们的体积越大,X取3,则体积为（18-2*3）*（14-2*3）*3＝2883.an=(3*an-1)-an-2,前面
为了决出胜负，最多再赛两局，用“甲”表示甲胜，用“乙”表示乙胜，于是这两局有四种可能：（甲，甲），（甲，乙），（乙，甲），（乙，乙）．其中甲获胜有3种，而乙只有1种，所以甲获胜的概率是34，乙获胜的概率是14．因此，合理的分法：甲得300元，乙得100元．
解答如下：根据概率计算可知,每个数字向上的概率都是1/6,所以可计算得知甲方获胜的概率P =（1/3）*（1/3）=1/9所以可知,乙方获胜的概率是1-1/9=8/9所以,乙方获胜的概率远远超过了甲方.修改方案：两个人分别抛掷10次,各自记录下每次抛掷的正面数字,10次之后,比较两人的成绩,两颗骰子的数字相同的次数越多
设用X分钟完成 12X+8X=10X=740 解X=2400分钟 甲 乙 丙
点数之积为质数时,只有1*2,1*3,1*5三种情形,可能性是36分之6,点数之积为合数时的可能性是36分之29,（还有1种是1*1）,所以对小刚有利.
5/8这个说法对
不公平,甲赢的几率偏高.首先:甲为偶数则赢,乙为单数才赢.那么,1,2,3,4,5假设甲要赢会怎么样呢?两种情况:1.甲出了单数手指同时乙出了单数手指,这个概率一目了然(3/5)*(3/5) = 9/252.甲出了双数手指同时乙出了双数手指,概率很明显(2/5)*(2/5)=4/25综上,甲赢的概率是13/25 > 1
以风做参照物，向一个方向行驶的三个物体，甲感觉顺风，乙感觉逆风，丙感觉无风，则说明甲的速度小于风速，乙的速度大于风速，丙的速度等于风速；即骑车速度最快的是乙；故答案为：乙．
用特殊元素法甲值周六: 只需再从周二到周四中选一个,乙丙都随便选,所以是C(4/1)*C(4/2)*C(2/2)=24甲值周二到周四的: 乙就只能从周二到周四中甲选剩下的和周一的三天中选两天,剩下是丙的 所以是C(4/2)*C(3/2)*C(2/2)=18两种做加法原则 24+18=42
分析：①根据（1）知道：丁不是第一名,甲不是第四名；②根据（2）知道：丙、丁会踢足球；③根据（3）知道：第一名和第三名不是乙.甲、丙.丁、乙.丁、丁.丙、丁.乙；④根据（4）知道：第二名不是乙、丙、丁；⑤根据（5）知道：乙、丁会骑自行车.一根据④知道：第二名是甲；二根据③知道：第一名和第三名不是丁,则丁是第四名；三还剩
假设当甲的岁数是乙的岁数的一半时,甲是a岁,乙就是2×a岁,丙38岁；当甲17岁的时候,注意到甲乙的年龄差不变,都是a,所以乙是17+a岁,那么丙是乙的2倍,就是2×（17+a）,再根据甲丙的年龄差可以得到：38-a=2×（17+a）-17,由此可以得到a是等于7的,所以在某一年,甲7岁,乙14岁,丙38岁,和是7+1
∵甲,乙,丙三个数的比是5：3：4,甲数是15,所以5：3：4 会等于15：乙数：丙数所以乙数是9 丙数是所以乙数比丙数少3
根据动量守恒定理：M甲*V甲+M人*V人=0 得：V甲=-1.5m/SM人*V人=（M人+M乙）*V船 得：V乙=1.2m/s,乙船运动方向与人跳的方向一致,与甲船相反
从第一到第四分别是：丙甲乙丁
/>抽取卡片有以下几种可能：34,35,36,45,46,56,奇,偶, 奇,奇,偶,奇显然,抽到的两张和为奇数的概率大,所以乙胜的概率大,不公平 将四张卡牌去掉2张,留下一张奇数的,一张偶数的,如 3 5,抽到为偶数则甲赢,奇数就乙赢,这样公平了
（1）轮船的速度为：v1=160÷8=20km/h；快艇的速度为：v2=160÷4=40km/h；v1＜v2，所以快艇的速度较大．（2）设在t时刻轮船和快艇的路程相等则：20t=40（t-2），解得：t=4，则当0＜x＜4时，快艇在轮船的后面；当4＜x＜8时，快艇在轮船的前面．（3）由（2）知，在4小时轮船和快艇的路程手机注册或绑定手机，可免费播放5道试题。
意见详细错误描述：
教师讲解错误
错误详细描述：
当前位置：>>>
你喜欢玩游戏吗？现在请你玩一个转盘游戏．如图所示的两个转盘中指针落在每一个数字上的机会均等．现同时自由转动甲、乙两个转盘，转盘停止后，指针各指向一个数字，用所指的两个数字作乘积．（1）列举（用列表或画树形图）出所有可能得到的数字之积；（2）求出数字之积为奇数的概率．
主讲：田冬平
给视频打分
地址：北京市海淀区北清路绿地中央广场12号楼303室
扫一扫有惊喜！
COPYRIGHT (C)
WWW.TIGU.CN INC. ALL RIGHTS RESERVED. 题谷教育 版权所有
京ICP备号 京公网安备