×

jQuery模拟福利彩票双色球机选

作者:cidy20172018.09.17来源:Web前端之家浏览:7205评论:0
关键词:机选随机取数

jQuery模拟福利彩票双色球机选.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            *
            {
                margin: 0;
                padding: 0;
            }
            div
            {
                width: 100px;
                height: 100px;
                border-radius: 50%;
                background: red;
                float: left;
                margin-left: 10px;
                box-shadow:2px 2px 2px 2px ;
                position: relative;
            }
            span
            {
                width: 60px;
                height: 60px;
                background: white;
                position: absolute;
                left: 20px;
                top: 20px;
                text-align: center;
                font-size: 50px;
                font-weight: bold;
                color: greenyellow;
            }
            #b1
            {
                background: linear-gradient(to top,blue,#fff);
                box-shadow: 2px 2px 2px 2px blue;
            }
            button
                {
                width: 100px;
                height: 50px;
                position: relative;
                left: -500px;
                top: 120px;
            }

        </style>
    </head>
    <body>
        <div><span></span></div>
        <div><span></span></div>
        <div><span></span></div>
        <div><span></span></div>
        <div><span></span></div>
        <div><span></span></div>
        <div id="b1"><span></span></div> 
        <button id="btn">机选一注</button>
        <button id="btn1">清空</button>
    </body>
    <script type="text/javascript">
        var ospan=document.getElementsByTagName('span');
        var btn=document.getElementById('btn');
        var btn1=document.getElementById('btn1');

        btn.onclick=function()
        {
            var arr=[]
            btn.disabled=true;
            btn1.disabled=true;
            reset()
            while(arr.length<ospan.length)
            {
                var n=Math.floor(Math.random()*35+1);
               var num=doit(n);
                if(arr.indexOf(num)==-1) 
                {
                    arr.push(num)
                }
            }
//          console.log(arr)
                var i=0;
        var s=setInterval(function()
        {
            ospan[i].innerHTML=arr[i]
            i++;
            if(i>=7)
            {
                clearInterval(s)
                btn.disabled=false;
                btn1.disabled=false;
            }
        },100)

    }
        function reset()
        {
            for (var i=0;i<ospan.length;i++) 
            {
                ospan[i].innerHTML=""             
            }
        }
        btn1.onclick=function()
        {
            reset()
        }
        function doit(n)
        {
            if(n<10)
            {
                return"0"+n
            }else
            {
                return n
            }
        }
    </script>
</html>

温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/jisuan23840238402834.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

  • Web前端之家

    是的,等其他人验证没问题再装吧,总会有第一个吃螃蟹的人,哈哈!!...

  • a235

    Windows11现在还不敢装吧,貌似需要等待很多软件测试,不然装了,就怕不兼容。...

  • Web前端之家

    GoogleAdSense可以的,可以加群主,帮你搞定这事情~~...

  • s121

    GoogleAdSense好弄吗,想弄一个账号。...

  • s121

    不错,正好用到,收藏了!...

  • 访客

    什么机翻...

  • Web前端之家

    只是更轻便,还是有些差距的呢,小项目可以玩玩。...

  • ja124

    这个跟vue和react比,好些吗?...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2021 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.6.8 Valyria