zoukankan      html  css  js  c++  java
  • 原生JS实现*36选7不重复(优化)

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>36选7</title>
    <script>
    //先循环36个数,放到num里面
    //给按钮添加事件
    //点击的时候 随机7个数放到jg里面
    var btn = null,
        num = null,
        jg = null;
        
        window.onload = function(){
            init();
            initDom();
            event();
        }
    //初始化变量
        function init(){
            btn = document.getElementById("btn");
            num = document.getElementById("num");
            jg = document.getElementById("jg");
        }
    //初始化页面元素的值
        function initDom(){
            var str = "";
            for(var i = 1 ;i<37;i++){
                str += i + ",";
            }
            str = str.substr(0,str.length-1);  //把36个数字组成的字符串的最后一个元素删除
            num.innerHTML = str;
        }
    //添加事件
        function event(){
            btn.onclick = xuanze;
        }
    //点击按钮的时候调用方法
        function xuanze(){
            //随机七个数放到结果里面
            var str = "";
            var n = 0;
            for(var i = 0 ;i<7;i++){
                n++;
                var zhi = parseInt(Math.random()*36)+1;
                console.log(str.indexOf(zhi));
                if(str.indexOf(zhi) == -1){  
                    str += zhi+",";
                }else{
                    i--;
                }
            }
    //        jg.innerHTML = str+";总共循环了"+n+"次";
            jg.value = str+";循环了"+n+"";
        }
    </script>
    </head>
    
    <body>
    <!--页面部分-->
    <div id="num"></div>
    <button id="btn">选择</button>
    <!--结果为:<span id="jg"></span>-->
    结果为:<input type="text" width="1000px" id="jg" value="">
    </body>
    </html>
  • 相关阅读:
    数组方法总结
    CSS3总结
    关于h5的一些知识整理
    如何去掉iview里面的input,button等一系列标签自带的蓝色边框
    CSS隐藏多余的文字
    百度搜索之历史搜索记录~
    transform相关~
    有关数组的相关知识~~
    [Javascript]js中所学知识点回顾总结
    js_随即生成多位验证码及变换颜色
  • 原文地址:https://www.cnblogs.com/lsqbk/p/10258967.html
Copyright © 2011-2022 走看看