本文实例讲述了jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法。分享给大家供大家参考，具体如下：
项目描述：九宫格的跑马灯抽奖特效，抽中奖品1-9的概率分别是2%，2%，4%，1%，12%，1%，8%，70%，概率总计100%，并且每天抽奖次数最多为3次。
html部分的代码和css部分的代码和上一节《jQuery移动端跑马灯抽奖特效》一样，没有修改，js部分有修改，增加了概率。
原理很简单，同样是取随机数，判断这个随机数的大小在100的0-2,2-4，4-8,8-9,9-21,21-22,22-30,30-100之间的哪一个数组内，随机就可判断中哪个奖项。
代码在前面一篇《jQuery移动端跑马灯抽奖特效》js的代码上面增加了一个maths_f()函数，如下：
function maths_f(maths){
if(maths>0&&maths<2){
console.log('恭喜获得奖品1')
twice=1;
}else if(maths>=2&&maths<=4){
console.log('恭喜获得奖品2')
twice=2;
}else if(maths>=4&&maths<8){
console.log('恭喜获得奖品3')
twice=3;
}else if(maths>=8&&maths<9){
console.log('恭喜获得奖品4')
twice=4;
}else if(maths>=9&&maths<21){
console.log('恭喜获得奖品5')
twice=5;
}else if(maths>=21&&maths<22){
console.log('恭喜获得奖品6')
twice=6;
}else if(maths>=22&&maths<30){
console.log('恭喜获得奖品7')
twice=7;
}else if(maths>=30&&maths<100){
console.log('恭喜获得奖品8')
twice=8;
}
light();
}
start()函数也有修改，修改为：
$('.start').click(function() {
if(click&&num>0) {
click = false;
maths = (Math.random() * 100);
console.log(maths)
maths_f(maths);
} else {
return false;
}
});
其他的自己看着改吧。
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery操作DOM节点方法总结》、《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery表格(table)操作技巧汇总》、《jquery中Ajax用法总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
您可能感兴趣的文章:
- 详解vue移动端项目代码拆分记录
- 使用vue开发移动端管理后台的注意事项
- vue插件mescroll.js实现移动端上拉加载和下拉刷新
- 移动端（微信等使用vConsole调试console的方法
- 利用Vconsole和Fillder进行移动端抓包调试方法
- jQuery实现适用于移动端的跑马灯抽奖特效示例
- 如何封装了一个vue移动端下拉加载下一页数据的组件
- 原生js实现移动端Touch轮播图的方法步骤
- js实现移动端轮播图
- 移动端使用CSS或JS判断横屏和竖屏的讲解
