html设置一个随机数的抽奖,随机数的运用---抽奖

首先我们先整理一下思路,看看需要用到些什么。

1、随机数

2、点击事件

3、计时器

4、抽完然后把定时器清一下

在html中先写一个简单的框架

然后我们来敲js

//封装一个随机数

function randoms(start, end) {

return Math.floor(Math.random() * (end - start + 1) + start);

};

var prizes = ['手机','平板','电脑','电视','冰箱','洗衣机'];

//获取按钮

var btn = document.getElementById('btn');

var result = document.getElementById('result');

//给按钮绑定单击事件

btn.addEventListener('click', counts);

i = 0;

function counts() {

i++;

var count = 0;//定时器

timer = setInterval(function () {

count++;

console.log(count);

result.innerHTML = prizes[randoms(0, prizes.length - 1)];

if (count >= 10) {

clearInterval(timer); //清除定时器

};

}, 100);

};

这样一个简单就抽奖我们就搞定了,是不是很简单呢!!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/527072.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

妖帝q群机器人_有关酷Q 晨风机器人,契约 qqlite qqlight ,mypc等QQ机器人关停一事的一点想法...

估计有不少朋友都使用过QQ机器人,因为很多网友每天都要管理很多个QQ交流群,如果一个人管理,估计都得累死,所以一般都会使用QQ机器人来帮助自己管理。只是腾讯自身的QQ机器人实在不给力,功能太鸡肋,而且不支…

水厂计算机知识,计算机信息在水厂中的管理与应用的探讨

【摘 要】本文介绍了计算机信息在水厂中的管理与应用的相关问题,详细分析了计算机信息是如何在水厂分控站实现自动控制功能的,并在文章结尾总结了计算机信息管理控制的特点以及应用效果。【关键词】计算机;系统;水厂;信…

else 策略模式去掉if_业务复杂=if else?刚来的大神竟然用策略+工厂彻底干掉了他们!...

​对于业务开发来说,业务逻辑的复杂是必然的,随着业务发展,需求只会越来越复杂,为了考虑到各种各样的情况,代码中不可避免的会出现很多if-else。一旦代码中if-else过多,就会大大的影响其可读性和可维护性。…

e.html5.qq.com,QQ群官网-开放能力

8. 设置提醒组件8.1 功能说明应用可以调用该组件设置日历提醒8.2 组件说明组件使用365日历提供的日历服务在需要使用的页面上嵌入js然后在需要的地方如下调用即可window.openGroup.setReminder({appid: 101234888, // 选填,若不填则使用url参数appid(必须有)// 当前…

istio springcloud_手牵手一起学Springcloud(1)微服务这么流行,你理解了嘛?

在前一段时间,我们实验室的项目开始变得越来越麻烦,代码也越来越臃肿,一个人兼顾前后端的全栈开发,实在是力不从心,没有一点点幸福感,于是迫切的想要解放生产力,放飞自我,因此开始决…

2021年计算机应用基础统考题库,2021年计算机应用基础统考题库试卷全-20210515145621.doc-原创力文档...

一、单选题1、第三代计算机运算速度_____。A:高于第二代但低于第四代B:高于第一代但低于第二代C:低于第一代D:高于第四代答案: A2、将计算机分为通用计算机、专用计算机两类分类原则是______。A:计算机解决…

力改变物体形状举例_人教版八年级物理下册第七章《力》知识点大全

力是物体对物体的作用,比如推土机推动了土。知识点1:力1.概念:是物体对物体的作用叫做力。2.特点:物体间力的作用是相互的。3.力的单位和表示符号:(1)力的单位:牛顿,简称牛(N)。托起一个鸡蛋大约…

计算机29首流行音乐叫什么,流行歌曲有哪些 流行歌曲500首

流行歌曲有哪些 流行歌曲500首作者: 锦瑟更新日期: 2020-10-15 21:43:12音乐是一种能治愈人心的存在,它还可以炒热气氛和渲染气氛,总之歌曲的共情能力是很强的,相信没几个人会不喜欢音乐的吧。小编也喜欢在无聊的时候听一下音乐呢&#xff0c…

bool类型数组转换成一个整数_Go 学习笔记 02 | 基本数据类型以及 byte 和 rune 类型...

一、基本数据类型unsafe.Sizeof() 查看不同长度的整型在内存中的存储空间。 类型转换,高位向低位转换要注意溢出。数字字面量语法。64 位系统中 Go 语言中浮点数默认是 float64。二、Golang 中 float 精度丢失问题利用第三方包:http://github.com/shopsp…

计算机应用基础(高起专)答案,东北师范大学14秋《计算机应用基础(高起专)》14秋在线作业1答案...

计算机应用基础(高起专)《计算机应用基础(高起专)》14秋在线作业1 一,单选题1. 局域网组网完成后,决定网络使用性能的关键是A. 网络的拓扑结构B. 网络的通信协议C. 网络的传输介质D. 网络的操作系统?正确答案:D2. 加工处理汉字信息时,使用汉…

ldap基本dn_LDAP 中 DN CN DC OU

DN 的英文名称是(distinguished name),直接翻译过来就是专有名称。简单的就可以理解为一个路径就对了。这个路径可以指向 OU ,也可以指到 CN。其中 DN 有三个属性,分别是CN,OU,DC。DC (Domain C…

学校计算机 电教材料账册,电教室管理制度

电教室管理制度(一)电教室必须有专人管理。未经许可,外人不得擅 自动用仪器、设备。(二)按配备标准和教学要求,及时申购仪器、设备及材料,保证教学正常进行。(三)仪器、设备、材料入库,要凭单据及时记账、编号后分类存放&#xff…

滴答定时器的计数模式_【高手私藏】STM32学习笔记:SysTick滴答时钟

今天我们来说说SysTick定时器。SysTick定时器在从参考手册中根本没有介绍。我费了九牛二虎之力才在一个犄角格拉里找到SysTick定时器的英文版的说明。在Cotex-M3有介绍,为什么要找STM32的介绍,是因为功能设置上还有点区别。首先看一下SysTick定时器的作用…

2008wsus创建和管理计算机组,Windows Server 2012 R2 WSUS-6:配置计算机组和客户端目标...

转载:https://blog.51cto.com/543925535/1406660对于WSUS来说,配置计算机的方式有两个出发点,一个是使用update services控制台来配置计算机组,计算机分组的管理都需要手动维护,第二种是使用计算机上的组策略和注册表设…

多选框实现全选_Angular1.x-checkbox-全选amp;单选amp;多选

ng-checked&#xff1a;Angular里ng-checked属性影响复选框的状态&#xff0c;值>true则复选框选中&#xff0c;值>false则取消选中。HTML:<div class"col-lg-4"><fieldset><legend>选题列表</legend><div class"table-respon…

复旦计算机考研复试要口试吗,2017复旦大学考研复试:英语口语面试常见问题汇总...

2017复旦大学考研复试&#xff1a;英语口语面试常见问题汇总本站小编 辅仁网/2017-12-29A magazine publisher is trying to decide how many magazines she should deliver to each individual distribution out let in order to maximize profits. She has extensive histori…

2020笔记本性价比之王_什么笔记本性价比高?2020性价比最高的笔记本电脑

阅读本文前&#xff0c;请您先点击上面的蓝色字体&#xff0c;再点击“关注”&#xff0c;这样您就可以继续免费收到最新文章了。每天都有分享。完全是免费订阅&#xff0c;请放心关注。注&#xff1a;本文转载自网络&#xff0c;不代表本平台立场&#xff0c;仅供读者参考&…

专利计算机存储介质是智力活动,涉及计算机程序的发明专利申请的相关问题PPT课件.pptx...

文档介绍&#xff1a;1提纲涉及计算机程序的专利申请涉及算法的专利申请“方法与产品相对应”的情形2涉及计算机程序的专利申请涉及程序本身的权利要求主题名称为程序限定内容涉及程序本身限定内容仅涉及程序本身限定内容一部分涉及程序本身3涉及计算机程序的专利申请主题名称为…

前端请求接口post_接口自动化测试-WEB资讯专栏-DMOZ中文网站分类目录

为什么UI自动化维护成本更高&#xff1f;因为前端页面变化太快&#xff0c;而且UI自动化比较耗时(比如等待页面元素的加载、添加等待时间、定位元素、操作元素、模拟页面动作这些都需要时间)为什么接口自动化维护成本较低&#xff1f;因为接口较稳定&#xff0c;接口的响应时间…

input css年月日,input标签的type为date,显示的日期格式样式更改

这个///是改不了---的&#xff0c;这是谷哥自带的功能样式&#xff0c;只能改颜色背景色等&#xff0c;如果要那种效果可以用日历插件有个取巧的方法&#xff0c;一个不能改的input覆盖在input type"date"上面*{margin: 0;padding: 0;}#div{width: 500px;height: 300…