js点击抽奖功能

最新推荐文章于 2023-08-21 13:26:46 发布

木木木和小琳琳

最新推荐文章于 2023-08-21 13:26:46 发布

阅读量220

点赞数

文章标签： javascript Powered by 金山文档

本文链接：https://blog.csdn.net/qq_19820589/article/details/129343182

版权

这段代码展示了如何使用JavaScript动态改变HTML元素的内容。通过点击‘开始’按钮，程序会在一个预设的数字列表中随机选取一个数字并显示，点击‘结束’按钮则会停止这个过程。主要涉及DOM元素获取、事件绑定、随机数生成以及setTimeout函数的应用。

摘要由CSDN通过智能技术生成

<div align="center">
    <div id="d"></div>
    <div  id="d1">
        <br>
        <label id="a">&nbsp</label>
    </div>
    <div>
        <br>
        <input type="button" onclick="sleep()" value="开始">
        //空格
        &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp 
        <input type="button" id="i2" value="结束">
    </div>
</div>

 var a=document.getElementById("a");
    var i2=document.getElementById("i2");
    let name;
    let l=["111","123","564","999","954","654","365","211","911","778","698","365","468","777","831","126"]; 
    // alert(l.length);
    //a.innerHTML=l[Math.round(Math.random()*(l.length-1))];
    function sleep(){
        flag=true;  //设置标志,判断停止时间
        setTimeout(change,50);  //随机跳动,延时50毫秒
    }  

    i2.onclick=function(){
    flag=false;  //结束标志
    }
    
    function change(){
        name = l[Math.floor(Math.random()*l.length)]; //随机取值
        console.log(name);
        if(!flag){
            a.innerHTML=name;
        }else{
            a.innerHTML=name;
            sleep();  //迭代  
        }
    }