小白用Math对象输入想获取的随机数范围并获取随机数

肉包嗷嗷叫

已于 2022-06-15 10:45:11 修改

阅读量92

点赞数

文章标签： javascript 前端 html5

于 2022-06-15 10:37:43 首次发布

本文链接：https://blog.csdn.net/difushouxi/article/details/125292459

版权

这篇博客介绍了如何利用JavaScript的Math对象在前端HTML中生成用户指定范围内的随机数，包括HTML部分和JavaScript部分的简单实现。适合初学者了解和学习。

摘要由CSDN通过智能技术生成

小白用Math对象输入想获取的随机数范围并获取随机数

html部分

<input type="text" id="min" placeholder="请输入获取随机数的范围">
<input type="text" id="max" placeholder="请输入获取随机数的范围">
<button id="but" onclick="getnum()">点我获取随机数</button>
<button id="but1" onclick="getstop()">点我停止</button>
<p id="message"></p>

js部分

 // 控制停止定时器的变量
    var timer = null
    // 先获取三个dom节点
    var but = document.getElementById("but")
    var message = document.getElementById("message")
    var but1 = document.getElementById('but1')
    var min = document.getElementById('min')
    var max = document.getElementById('max')

    // 点击获取随机数的函数
    function getnum(a, b) {
        if (min.value == '' || max.value == '') {
            alert("请输入随机数的范围值")
        } else {
            a = 0
            b = 0
            var a = min.value
            var b = max.value
            timer = setInterval(() => {
                message.innerHTML = ''
                message.innerHTML = getRandomInt(a, b)
            }, 10);
        }
    }
    //停止获取随机数的函数
    function getstop() {
        clearInterval(timer)
        min.value = ''
        max.value = ''
    }
    //获取两个数之间的随机整数的函数
    function getRandomInt(min, max) {
        min = Math.ceil(min)
        max = Math.floor(max)
        return Math.floor(Math.random() * (max - min) + min)
    }