js定时器：整点定时选秀，让你的后宫活跃起来！

﹏ヽ暗。殇╰゛Y 2022-12-25 11:59 115阅读 0赞

## 通过JS定时器实现定时自动选秀！ ##

功能：定时自动选秀，显示系统时间，记录每次选中的人物，可以去除重复名字

![在这里插入图片描述][20201201205414946.png]  
**HTML代码:**

<span>当前时间：
        <input type="text" id="input1">
        <button οnclick="start2()">点击开始</button>
        <button οnclick="stop2()">点击停止</button><br>
        选中的名字有：<p id="p" style="border: 1px solid red;height: 20px;width: 250px"></p>
        <button οnclick="move()">去重</button>
    </span>
    
    <hr>
    
    <h3 style="color: red" id="h3">选秀现场</h3>
    <div id="div1" style="width:500px;height: 400px;"></div>

**JS代码：**

<script>
        let b;
        /*获得input标签对象*/
        let input1 = document.getElementById("input1");
        let p=document.getElementById("p")
        /*开启循环定时器*/
        let UList=[] function start2() { 
            let s1 b=setInterval(function () { 
                /*获得当时间戳*/
                let datec = new Date()
                /*将时间戳进行转换*/
                input1.value=datec.toLocaleString() if(datec.getSeconds()==0 || datec.getSeconds()==30 || datec.getSeconds()==15 || datec.getSeconds()==45){ 
                    s1=new Date().getSeconds()
                    start1()
                }else{ 
                    let s2=new Date().getSeconds() if(s2-s1==5){ 
                        stop1()
                        UList.push(list[count])
                        p.innerText=UList
                    }
                }
            },1000)
        }
        function stop2() { 
            clearInterval(b)
        }
    
        let list=['妲己','西施','貂蝉','金莲']
        let count
        let div1 = document.getElementById("div1");
        let h3 = document.getElementById("h3"); function start1() { 
            a=setInterval(function () { 
                if(count==4){ 
                    count=0;
                }
                count=Math.floor(Math.random()*4)
                div1.style.backgroundImage='url(img/'+list[count]+'.jpg)';
                h3.innerText="王耀龙选秀现场 选中了："+list[count]
            },100)
        }
        function stop1() { 
            clearInterval(a)
        }
    
        function move(){ 
            var a = { };/*定义了一个json {key：value}*/
            for (var i=0; i<UList.length; i++) { 
                var v = UList[i];/*得到名字给v*/
                /* 判断key的值是否为 undefined */
                if (typeof(a[v]) == 'undefined'){ 
                    a[v] = 1;
                }
            }
            /*清空ULiet数组*/
            UList.length=0; for (var i in a){  /*将a的key赋值给UList*/
                UList[UList.length] = i;
            }
            p.innerText=UList
        }
    </script>

**效果图：**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW96aHV6aHV5YW5n_size_16_color_FFFFFF_t_70]

[20201201205414946.png]: /images/20221120/8c4c350b3c874312b7cc979e837d82f5.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW96aHV6aHV5YW5n_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20201201210053401.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW96aHV6aHV5YW5n,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，115人围观）

还没有评论，来说两句吧...

相关阅读

相关 js 定时任务，定时器

window.setTimeout("funTimeout();", 1000); //按照指定时间，只执行一次 window.setInterval("funInterv

红太狼/ 2023年10月06日 05:30/ 0 赞/ 36 阅读

相关 js定时器：整点定时选秀，让你的后宫活跃起来！

通过JS定时器实现定时自动选秀！功能：定时自动选秀，显示系统时间，记录每次选中的人物，可以去除重复名字 ![在这里插入图片描述][20201201205414946.

﹏ヽ暗。殇╰゛Y/ 2022年12月25日 11:59/ 0 赞/ 116 阅读

相关让定时任务 xxl job 里面的任务灵活起来

在项目当中使用定时任务进行业务补偿是一种很常见的需求。对于一个任务，我们常常把开始时间或者结束时间固定在代码里面。如果出现了定时任务漏掉了数据。比如：定时任务：查询

朴灿烈づ我的快乐病毒、/ 2022年10月11日 12:29/ 0 赞/ 84 阅读

相关算法优化,让你的软件飞起来

朋友曾经给我推荐了一个有关代码优化的pdf文档《让你的软件飞起来》，看完之后，感受颇深。为了推广其，同时也为了自己加深印象，故将其总结为word文档。下面就是其的详细内容总结，

一时失言乱红尘/ 2022年08月27日 04:41/ 0 赞/ 228 阅读

相关 iOS开发系列--让你的应用“动”起来

概览在iOS中随处都可以看到绚丽的动画效果，实现这些动画的过程并不复杂，今天将带大家一窥iOS动画全貌。在这里你可以看到iOS中如何使用图层精简非交互式绘图，如何通过核

古城微笑少年丶/ 2022年08月21日 08:59/ 0 赞/ 198 阅读

相关选秀打分

//-------------------------------------基础版------------------------- //-----------------

我就是我/ 2022年07月15日 04:43/ 0 赞/ 237 阅读

相关怎么样让你的系统定时关机

这个方法是利用cmd.exe实现的。 cmd.exe就想以前的command.com一样，运行以后是一个DOS窗口。但是cmd.exe的功能及其强大，远远超过

向右看齐/ 2021年10月24日 05:34/ 0 赞/ 313 阅读

相关 Emmet-让你的编码速度飞起来

Emmet代码补全语法 html文件 ![70][] 常用的字符有：> + ^ \ () > > 表示父子关系 > > + 表

青旅半醒/ 2021年09月16日 05:10/ 0 赞/ 417 阅读

相关 bootstrap-switch.js，让checkbox美起来

[bootstrap-switch.js][]是一个很美（对，只能这一个字）的开关按钮组件。效果 ![这里写图片描述][20151012175011067] ![

妖狐艹你老母/ 2021年09月10日 15:20/ 0 赞/ 362 阅读

相关用js写的旋转木马，在新年献给各位刚登基的皇帝，让你的后宫转起来！程序员就是可以为所欲为！

目录效果图：实现的内容：代码奉上：实现原理我就不写了，代码注释的比较详细，欢迎指正！！ --------------------

深藏阁楼爱情的钟/ 2021年07月24日 23:26/ 0 赞/ 279 阅读