JS抽奖功能代码
HTML
<label for="awardListDom">奖项列表</label><br>
<input type="text" value="" id="awardListDom"> <br>
<label for="num">抽到的奖</label><br>
<input type="text" value="" id="num"> <br>
<button id="submit">开始抽奖</button>
JS
<script>
function random(min,max){
return Math.floor(min+Math.random()*(max-min));
}
var awardListDom=document.getElementById("awardListDom"),
num=document.getElementById("num"),
submit=document.getElementById("submit");
var awardList=["一等奖","二等奖","二等奖","三等奖","三等奖","三等奖","鼓励奖","鼓励奖","鼓励奖","鼓励奖","谢谢参与","谢谢参与","谢谢参与","谢谢参与","谢谢参与","谢谢参与"]; awardListDom.value=awardList;
submit.onclick=function(){
//引用数组
var oldArray=awardList;
var rNum=random(0,oldArray.length); if(oldArray.length<1){
awardListDom.value="活动结束";
num.value="活动结束";
}
else{
num.value=oldArray[rNum];
oldArray.splice(rNum,1);
awardListDom.value=oldArray;
}
}
</script>
核心:
js的Math对象和Array对象
思路:
1.随机抽奖,抽一个奖项便减少一个 2.Math 对象方法:http://www.w3school.com.cn/jsref/jsref_obj_math.asp 3.-random():返回 0 ~ 1 之间的随机数. 4. -floor():获取整数
数组操作:
- splice(x,y); x:起始位置, y:获取并删除个数
JS抽奖功能代码的更多相关文章
- html和js基础功能代码备份
1)贴图:<img src="图片地址">2)加入连接:<a href="所要连接的相关地址">写上你想写的字</a> 3) ...
- JS 打印功能代码可实现打印预览、打印设置等
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or ...
- 原生JS实现购物车结算功能代码+zepto版
html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- js经常使用功能代码
js经常使用功能代码(持续更新): 1---折叠与展开 <input id="btnDisplay" type="button" class=" ...
- js 抽奖转盘实现
今天用js实现转盘抽奖功能,从后台返回的值可以固定转盘选择停止的任意位置 实现代码如下: js: <script> , i = ;//auto:时间对象 count:计数器 ,i : 计数 ...
- jquery实现简单抽奖功能
一直纠结要怎么用jquery实现抽奖功能,看别人很多都是用flash制作的,找了很多资料,最终找到一个比较适合需求的,我做了些许调整,以下是代码展示(复制下来可以直接使用). 先上图:
- JS函数 -- 功能,语法,返回值,匿名函数,自调用匿名函数,全局变量与局部变量,arguments的使用
“JavaScript设计得最出色的就是它的函数的实现.” -- <JavaScript语言精粹> 函数包含一组语句,它们是JS的基础模块单元,用于指定对象的行为.一般来说,所谓编程,就是 ...
- 自己封装的JS分页功能[用于搭配后台使用]
* 2016.7.03 修复bug,优化代码逻辑 * 2016.5.25 修复如果找不到目标对象的错误抛出. * 2016.5.11 修复当实际页数(pageNumber)小于生成的页码间隔数时的bu ...
- js抽奖跑马灯程序
js抽奖跑马灯程序 点击下载代码
随机推荐
- Android成长日记-数据存储之SQLite[2]
Part one: 首先看这样一段代码 SQLiteDatabase db=openOrCreateDatabase("SQLDemo.db", MODE_PRIVATE,null ...
- C#如何在子窗体获取父窗体的实例
在子窗体可以使用this.Owner来获取父窗体的实例
- Scala implicit
Scala implicit implicit基本含义 在Scala中有一个关键字是implicit, 之前一直不知道这个货是干什么的,今天整理了一下. 我们先来看一个例子: def display( ...
- select 1 from dual 中的1表示的含义
select 1 from dual 在这条sql语句中的1代表什么意思?查出来是个什么结果? 其实: select 1 from table; select anycol(目的表集合中的任意 ...
- .net图片验证码生成、点击刷新及验证输入是否正确
①创建ValidateCode.aspx,在ValidateCode.aspx.cs中加入如下代码.生成验证码图片,在页面上输出,输出jpeg格式. protected void Page_Load( ...
- phpstorm取消自动保存,修改快捷键并标识修改的文件为星星标记
编辑时间: 2016-8-3 15:15:37 个人通过使用,发现PhpStorm的确是 编辑PHP 的神器,提供用户效率,提供智能代码补全,快速导航以及即时错误检查. 不过,让我用起来不爽的是,它会 ...
- JSP实现数据传递与保存
业务逻辑: 1.登陆login.jsp 2.判断登陆是否成功check.jsp 3.登陆成功页面newsDetail.jsp 4.登陆失败转发到login.jsp 代码如下: <%@ page ...
- Beta Daily Scrum 第三天
[目录] 1.任务进度 2.困难及解决 3.燃尽图 4.代码check-in 5.总结 1. 任务进度 学号 今日完成 明日完成 612 初步完成成就界面的统计图表 继续编写成就界面的图表 615 白 ...
- JSF JQUERY 使用datepicker
不推荐使用.可以用primefaces的p:Calendar替代,更换控制使用. 简单使用jquery的datepicker示例: <!doctype html> <html lan ...
- gnuplot conditional plotting: plot col A:col B if col C == x
http://stackoverflow.com/questions/6564561/gnuplot-conditional-plotting-plot-col-acol-b-if-col-c-x H ...