JS生成指定范围随机数——抽奖_js生产随机数1500-2500-CSDN博客

本文链接：https://blog.csdn.net/Romaga/article/details/79826169

使用Math.random（）方法实现一个抽奖程序：页面中连续、快速、随机显示2000-5000之间的4位数号码，当点击 button（抽奖按钮）时停止，并显示抽中的号码。

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>luckyman</title>
</head>
<style>
   #number{
       width: 72px;
       height: 68px;
   }
</style>
<body>
   <center>
   <p id="number"></p>
   <button οnclick="start()">开始</button>
   <button οnclick="stop()" >停止</button>
   </center>
</body>
</html>
<script>
   var num = document.getElementById('number');
   var result = null;
   function start(){
       if (result == undefined){
           result = setInterval(function (){
           num.innerHTML = Math.floor(2000 + Math.random()*3000);},100);
       }
    }
   function stop(){
       clearInterval(result);
       result = null;
   }
   function random(){
       return Math.floor(2000 + Math.random()*3000);
   }

</script>

关键：

1、生成指定范围内随机数：function random(){

return Math.floor(2000 + Math.random()*3000); } //【Math.floor( min + Math.random()*(max - min));】

2、result标识——是否已经生成随机数（生成=需要周期执行的setInterval(函数名，周期跨度)，未生成=null,）；是否还需要生成随机数（要停止->再次赋初值null-使其变成不生成随机数的状态）

3、隐性问题：函数的作用域 function start(){ //循环生成随机数

       if (result == undefined){
           result = setInterval(function (){
           num.innerHTML = Math.floor(2000 + Math.random()*3000);},100);

}}

4、在最开始参考别人代码和后面自己写的时候，发现有两种按钮的定义方式:

<button οnclick="start()">开始</button>

<input value="START" id="start" type="button" />

<button>标签定义一个按钮。
在button元素内部，可以放置内容，比如文本或图像。这是该元素与使用input元素创建的按钮之间的不同之处。
<button>控件与<inputtype="button">相比，提供了更为强大的功能和更丰富的内容。<button>与</button>标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。例如，我们可以在按钮中包括一个图像和相关的文本，用它们在按钮中创建一个吸引人的标记图像。
唯一禁止使用的元素是图像映射，因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。
请始终为按钮规定type属性。InternetExplorer的默认类型是"button"，而其他浏览器中（包括W3C规范）的默认值是"submit"。