JS实现随机抽取,抽取到后将不再出现

功能:随机抽取,抽取到后不会再次出现,关闭网页后再次打开会继续上一次的开始。

 

原理:利用 Math.random 方法实现随机数生成,随机数 * 数组长度,然后向下取整 ,获得随机数,当作数组下标;

利用 locaStorage 实现本地永久储存 ,再次打开网页的时候获取本地储存的数据,继续上一次的开始。

 

参数:

       array:你想要抽取数据的数组;

       start:开始按钮的节点;

       stop:停止按钮的节点;

       clear:清空本地储存即重置按钮;

       result:放置抽取出来内容的节点;

代码如下:
 

    var init = function(array, start, stop, clear, result) {
        var num;
        var count = 1;
        var i;
        var arr = [];
        if (localStorage.array != undefined) {
            array = localStorage.array.split(",");
            arr = localStorage.arr.split(",");
        }
        start.onclick = function() {
            if (count) {
                i = setInterval(function() {
                    num = Math.floor(Math.random() * array.length);
                    result.innerHTML = array[num];
                }, 10);
                count = 0;
            }
        }
        stop.onclick = function() {
            clearInterval(i);
            count = 1;
            arr.push(array[num]);
            array.splice(num, 1);
            if (array.length == 0) {
                alert("本期结束,下一轮将从新开始");
                array = arr;
                arr = [];
            }
            localStorage.array = array;
            localStorage.arr = arr;
        }
        clear.onclick = function() {
            localStorage.clear();
            window.location.reload();
        }
    }
 
 
    init(array, start, stop, clear, result);

欢迎大家评论。

  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值