js摇奖小程序

最新推荐文章于 2024-07-30 10:56:44 发布

youlanw

最新推荐文章于 2024-07-30 10:56:44 发布

阅读量2.5k

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/hbyxly/article/details/30887437

版权

<html>
<head>
    <title>物 联 班 摇 奖 程 序 </title>
    <script type="text/javascript">

        var array_name = [

            "黄昌龙", " 刘 华", " 黄 强", "李明杰", " 许 磊",
            " 许 傲", " 曹 芳", " 李 珂", "陈德龙", "陈小兰",
            " 刘 锐", "范学文", " 肖 格", "刘灿伟", "郑梦丽",
            " 曾 岑", "李海晨", " 刘 俊", " 丁 毅", "王云飞",
            "陈源源", "胡思亮", "王宜国", " 万 浩", " 张 卉",
            "吴清华", "李傲寒", "罗祖雨", " 秦 康", "张亚楠",
            " 徐 聪", "赵志颖", "庄爱民", "陈国超", " 陈 佃",
            "王绍慧", "伍子雄", "危光辉", " 曹 宇", "许泽雄",
            "毛泽铭", " 程 争", " 李 亿", "严智望", "柯志敏",
            "王模国", "闻青青", " 徐 倩", "李长力", "严金龙", "孙姿雯"

         ];


        var array_color = ["red", "green", "blue", "#FF4500", "#8B008B", "#4B0082", "#8B1A1A"];


        //随机数界限值
        var len_Name = array_name.length;
        var len_Color = array_color.length;
        var indexOfName = 0;    //  姓名数组 下标
        var indexOfColor = 0;  //   颜色数组 下标
        var tmr;
        //计时器
        function start() {
            if (len_Name > 5) {
                indexOfName = getNum(len_Name);
                indexOfColor = getNum(len_Color);
                txtName.value = array_name[indexOfName];
                txtName.style.color = array_color[indexOfColor];
                setStyle_Start(); //设置样式
                tmr = setTimeout("start()", 50); // 启动
            } else {

                var choose = confirm("摇奖完毕，继续抽奖？");

                if (choose) {
                    result.innerHTML = "";  //清空
                    txtName.value = null;
                    len_Name = array_name.length;
                }
                else {
                    btnStart.disabled = true;
                    for (var i = 0; i < len_Name; i++) {
                        txtName.value = array_name[i];
                        result.innerHTML += txtName.value + "<br/>";
                    }
                }


            }
        }

        function stop() {
            clearTimeout(tmr);  //停止
            swapNum();  //交换位置
            result.innerHTML += txtName.value + "<br/>";
            setStyle_Stop();
        }

        //交换位置(相对最后一项替换当前项，实现无重复) 
        function swapNum() {
            var temp;
            temp = array_name[indexOfName];
            array_name[indexOfName] = array_name[--len_Name];
            array_name[len_Name] = temp;
        }

        //产生随机数
        function getNum(length) {
            return Math.floor(Math.random() * length);
        }

        //批量摇
        function lotSize(n) {
            for (var i = 0; i < n; i++) {
                indexOfName = getNum(len_Name);
                result.innerHTML += array_name[indexOfName] + "<br/>";
                swapNum();
            }
        }

        //加载事件
        window.onload = function () {
            var n = prompt("请输入批量摇的数", "0");
            if (!(isNaN(n)) && (len_Name >= 1 && n <= len_Name))
                lotSize(n);
            else
                alert("什么哟，亲！");
            btnStart.onclick = start;
            btnStop.onclick = stop;
        }

        //设置样式
        function setStyle_Start() {
            btnStart.disabled = true;
            btnStop.disabled = false;
            btnStart.style.fontSize = "12px";
            btnStop.style.fontSize = "20px";
            txtName.style.fontSize = "12px";
        }

        function setStyle_Stop() {
            btnStop.disabled = true;
            btnStart.disabled = false;
            btnStop.style.fontSize = "12px";
            btnStart.style.fontSize = "20px";
            txtName.style.fontSize = "20px";
        }

    </script>
</head>
<body>
    <center>
        <table border="0" cellpadding="0" cellspacing="0">
            <tr align="center">
                <td colspan="3" style="font-family: 'Courier New', Courier, monospace; font-size: x-large;
                    height: 45px;">
                    简 易 抽 奖 程 序
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" id="txtName" style="text-align: center; font-size: 20px;" readonly="readonly" />
                </td>
                <td>
                    <input type="button" id="btnStart" value="Start" style="font-family: 'Courier New', Courier, monospace;
                        font-size: 20px;" />
                </td>
                <td>
                    <input type="button" id="btnStop" value="Stop" style="font-family: 'Courier New', Courier, monospace;"
                        disabled="disabled" />
                </td>
            </tr>
        </table>
    </center>
    <div id="result" align="center" style="margin: 12px auto; font-family: 'Microsoft YaHei UI';
        font-size: xx-large; color: #CC0066; background-color: #00FFFF;" />
</body>
</html>

youlanw

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
js摇奖小程序

//随机数界限值 var len_Name = array_name.length; var len_Color = array_color.length; var indexOfName = 0; // 姓名数组下标 var indexOfColor = 0; // 颜色数组下标 var tmr; //计时器 function start() { if
复制链接

扫一扫