Javascript小小抽签器
有时候我们常常会面临一些需要抽签的情况，作为IT人，不必从网上找一些抽签软件、小程序、在手机上下载一些抽签APP！OK，今天我们直接用JS实现一个小小抽签器，也就五分钟的事情，还能让人觉得耳目一新。诶呦？你小子这么喜欢编程（这么能装）？
随机抽签器
抽签
使用随机数做的小玩意，可以右键查看页面源代码学习链接
var intervalId;
var texts = ["文本1","文本2","......",];
var currentIndex = 0;
var draw = document.getElementById("draw");
var go_on = document.getElementById("go_on");
var textElement = document.getElementById("text");
这一部分就是喜闻乐见的用ID给所有控件注册变量的环节，有了这些变量我们就可以操作控件。
function startInterval(){
stopInterval();
intervalId =setInterval(function() {
textElement.textContent = texts[currentIndex];
currentIndex = (currentIndex + 1) % texts.length;
}, 30);
}
function stopInterval() {
clearInterval(intervalId);
}
这一部分是在startInterval()函数中定义一个计时器，并添加文字闪动功能，
textElement.textContent = texts[currentIndex];是将h1标签里的文字切换成数组中对应currentIndex下标的值， currentIndex = (currentIndex + 1) % texts.length;是在数组越界时重置当前下标的值。
setInterval（function，time）的第二个参数30是，每隔0.03秒进行一次刷新。
function getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
}这个函数的作用是获取一个随机数字。
go_on.onclick = function(){
startInterval();
}这是给继续抽签按钮注册事件，意思是重启计时器。
draw.onclick = function(){
var randomNum = getRandomInt(0, 15);
console.log(randomNum);
textElement.textContent = texts[randomNum];
stopInterval();
};这就是抽签功能实现的函数，动态效果和抽签是分开实现的，动态效果只是为了好看。
我的任务完成了！！！最终效果是这样滴：
可惜CSDN上传视频审核太慢了，大致就是这样啦，想象一下文字在设定的几个文本里来回跳动哦。
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！