分享一篇旧笔记。
输入开始范围和结束范围,结束获得随机数
附上两个求随机数的网址:
http://www.cnblogs.com/rexmzk/archive/2012/03/07/2384409.html
http://www.jb51.net/article/56019.htm
贴上代码:
html:
<div class="container"> <div class="context" id="context">开始抽奖!</div> <div class="token"> 开始号码:<input type="text" id="start_num" /> 结束号码:<input type="text" id="stop_num" /> </div> <span id="play">开 始</span> <span id="stop">停 止</span> <div class="clear_fix"></div> </div>
css:
<style> *{ padding: 0; margin: 0; } .container{ width: 630px; height: 320px; margin:0 auto; text-align: center; color: red; border: 1px solid black; margin-top: 130px; } .context{ font-size: 25px; font-family: "微软雅黑"; font-weight: bold; } .token{ margin-top:40px; } .container>span{ background: #4A708B; border-radius: 7px; display: block; float: left; height: 30px; line-height: 30px; width: 80px; margin-top: 60px; cursor: pointer; color: #fff; } #play{ margin-left: 210px; } #stop{ margin-left: 45px; } .clear_fix{ clear: both; } </style>
js:
<script> //计时器的接收 var timer=null; //标记键盘按下的动作 var flag =0; window.onload = function(){ var play = document.getElementById("play"); var stop = document.getElementById("stop"); //开始抽奖 play.onclick = playFun; //结束抽奖 stop.onclick = stopFun; //键盘事件 document.onkeyup = function(event){ var event = event || window.event; if(event.keyCode==13){ if(flag==0){ playFun(); } else{ stopFun(); } } } } function playFun(){ //获取输入的开始值和结束值(字符串) flag=1; var start_num = document.getElementById("start_num").value; var end_num = document.getElementById("stop_num").value; var context = document.getElementById("context"); var play = document.getElementById("play"); if(isNaN(start_num) || isNaN(end_num)){ alert("开始和结束范围只能为数值,请重新输入!"); return; } else if(start_num >= end_num){ alert("开始值要小于结束值!") return; } //如果未输入值,默认范围 else if(start_num == false || end_num == false){ alert("未输入开始和结束范围,系统默认为:1-100"); play.style.background="#A3A3A3"; start_num = 1; end_num = 100; } else{ play.style.background="#A3A3A3"; //转换为整型,方便取随机数 start_num = parseInt(start_num); end_num = parseInt(end_num); //避免重复按键计时器越来越快,在按键前先清空重复执行效果 clearInterval(timer); //每过0.1秒重复执行 timer = setInterval(function(){ //获取随机数[start_num,end_num] var num = Math.floor(Math.random()*(end_num)+start_num); //改变值 context.innerHTML=num; }, 100) } } function stopFun(){ clearInterval(timer); flag=0; var play = document.getElementById("play"); play.style.background="#4A708B"; } </script>
效果展示:
PS(键盘只做了按下ENTER的反应)
开始抽奖!
开始号码: 结束号码:
开 始 停 止
以上内容,如有错误请指出,不甚感激。