前端笔记80——获取随机数

前言

我们在日常的开发当中，我们需要获取随机数，那么前端是怎么去实现的呢？下面来分享一下我获取随机的方法。

获取随机数的实例

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title></head><body><input type="text" id="ipt" /><button id="start">开始</button><button id="stop">结束</button><script type="text/javascript">var oStart = document.getElementById("start")var oStop = document.getElementById("stop")var oIpt = document.getElementById("ipt")var timmer = null// 点击开始按钮，生成一个随机数(m,n),把随时数放到ipt中oStart.onclick = function() {// 解决bug思路：在每次开启一个新定时器之前，先把上一次的给清除clearInterval(timmer)// 开启定时器,timmer表示定时器的idtimmer = setInterval(function() {// 在没有清除定时器之前，随着点击次数不停点击，定时器会开启越来越多var randomInt = getRandomInt(10, 30)oIpt.value = randomInt}, 1000)}// 点击结束的时候，停止oStop.onclick = function(){// 清除定时器clearInterval(timmer)}function getRandomInt(min, max) {return Math.floor(Math.random() * (max - min + 1) + min)}</script></body></html>

前端笔记80——获取随机数相关推荐

前端笔记-thymeleaf获取及回显input标签type=radio
如下演示: 回显: 前端代码如下: <div class="form-group"><label>性别</label><br/>&l ...
前端笔记-thymeleaf获取及回显input标签type=time
前端效果如下: 设置的时候就是这样的前端代码如下: <div class="form-group"><label>开课时间</label>&l ...
前端笔记-thymeleaf获取及回显input标签type=date
这是前端回显的数据: 修改界面: 前端相关代码: <div class="form-group"><label>出生时间</label>< ...
前端笔记-thymeleaf获取及回显select数据(combox)
如下: 以及回显前端代码如下: <div class="form-group"><label>选课</label><select nam ...
前端笔记知识点整合之服务器Ajax（上）服务器PHP数据交互HTTP
前端笔记知识点整合之服务器&Ajax(上)服务器&PHP&数据交互&HTTP 一.服务器 1.1 什么是服务器,做什么的? 服务器,就是放在机房中的电脑,和我们的电脑的 ...
32位汇编语言学习笔记(43)-- 生成随机数
此程序出自<Assembly Language step by step programming with linux>第12章,用于演示随机数函数的使用,共涉及两个随机数函数: v ...
[前端笔记——HTML介绍] 4.HTML文本基础+超链接+高级文本格式
[前端笔记--HTML介绍] 4.HTML文本基础+超链接+高级文本格式 1.HTML文本基础 1.1标题和段落 1.2列表 1.2.1无序列表(unordered) 1.2.2有序列表(ordere ...
Henry前端笔记之 Date对象详解
Henry前端笔记之 Date对象详解 Date 对象 1 时间格式简介 2 Date.now 与 new Date().getTime() 的区别 3 Date对象详解普通函数的用法构造函数的用 ...
Henry前端笔记之 UI组件库中table与slot相关理解
Henry前端笔记之 UI组件库中table与slot相关理解作用域插槽: 解构赋值基础:https://developer.mozilla.org/zh-CN/docs/Web/JavaScrip ...

前端笔记80——获取随机数

前言

获取随机数的实例

前端笔记80——获取随机数相关推荐

最新文章

热门文章