我是石家庄做网站的一名前端工程师,今天我给大家分享的demo是js实现点击随机数。希望这个demo希望对大家能有所帮助,我把代码贴到下面了。
效果图:
代码
样式
.box {
width: 760px;
height: 245px;
float: left;
border: #888 solid 2px;
margin-right: 30px;
}
#layer {
font-family: Verdana;
font-size: 200px;
color: #888;
}
#btn {
float: left;
font-family: arial;
color: #14396A !important;
font-size: 30px;
padding: 14px 28px;
margin-top: 90px;
background: #63B8EE;
}
Body
<div class="box">
<span id="layer">000000</span>
</div>
<div>
<input type="button" value='生成随机数' id="btn" />
</div>
Js
var rand_btn = document.getElementById("btn");//获取按钮
rand_btn.onclick = function() {//绑定点击事件
Lottery();//调用下面写好的function
clock = setTimeout('clearTimeout(T)', 1000);
//一秒后清除定时器
}
function Lottery() {
//限制六位数
var Num = Math.floor((Math.random() * 900000 + 100000));
var result = document.getElementById("layer");//获取显示框
if(result != null) {//判断是否有显示框
result.innerHTML = Num;//吧我们生成的随机数放大到显示框内
console.log(Num)//在控制台打印生成的随机数
}
//0.01秒执行一次函数
T = setTimeout('Lottery()', 10);
}
以上就是石家庄做网站的尚武科技为大家分享的js点击实现随机数的demo希望对各位小伙伴有所帮助。
如果大家对有什么技术方面的问题,可以关注石家庄做网站的尚武科技官方公众号“尚武科技π”,其中会有大量关于”互联网+”的相关的内容供大家互相学习了解,同时欢迎大家一起讨论技术问题。
通过以上内容的说明,大家对如何用js实现随机数已经有了一定的了解。如果大家对这个功能有什么问题可以在尚武科技π留言,我们会在下期的文章更新中为您解答您的问题。
希望石家庄做网站的尚武科技做网站做的越来越好。
如果大家觉得尚武科技π写的文章对大家有用的话别忘了分享给朋友,万分感谢大家对尚武科技π的支持。