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抽奖跑马灯程序 点击下载代码
随机推荐
- 【poj2774】 Long Long Message
http://poj.org/problem?id=2774 (题目链接) 题意 给出两个只包含小写字母的字符串,求出最长连续公共子串. solution 第一次用后缀数组,感觉有点神...才发现原来 ...
- 学习通过Thread+Handler实现非UI线程更新UI组件
[Android线程机制] 出于性能考虑,Android的UI操作并不是线程安全的,这就意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为了解决这个问题,Android制定了一条简单的规则 ...
- Bzoj3663/4660 CrazyRabbit
题意:给定平面上一个圆和一堆圆外的点,要求选出尽可能多的点使得它们之间两两连线都不和圆相交.保证任意两点连线不和圆相切.点数<=2000 这题是很久以前在某张课件上看见的.看了题解还搞了三小时, ...
- git实习笔记
一.查找文件目录 二.添加上传文件 三.提交文件,描述信息 四.登录
- JSP+JavaBean+Servlet实现各类列表分页功能
需求: 每页列表下都有一个分页的功能,显示总数量.当前页/总页数.首页.上一页.下一页.最后一页.GO到第几页 效果动态图: 实现思路: 因为每个列表页都需要,在每个出列表页数据的servlet中都要 ...
- BZOJ1031: [JSOI2007]字符加密Cipher
传送门 后缀数组模板题 //BZOJ 1031 //by Cydiater //2016.9.21 #include <iostream> #include <cstring> ...
- Docker探索系列2之镜像打包与DockerFile
preface docker基本入门以后,可以试试打包docker镜像与dockerfile了 docker镜像 docker hub仓库有2类仓库,用户仓库和顶层仓库,用户仓库由docker用户创建 ...
- boolean 和 Boolean 类型数据的差别
工作中遇到页面传递布尔类型的数据问题,需要在代码中判断不能为null,就此思考一下,boolean和Boolean之间的区别?boolean是基本数据类型Boolean是它的封装类,和其他类一样,有属 ...
- js006-面向对象的程序设计
js006-面向对象的程序设计 面向对象(Object-Oriented,OO)的语言有一个标志,那就是他们都有类的概念.而通过类可以创建多个具有相同属性和方法的对象. ECMA-262把对象定义为: ...
- Oracle 的表备份的方法
1.直接备份(防止误操作后数据库表不能恢复) create table new_table as select * from old_table; 2.创建表头,然后插入列(繁琐的做法) create ...