随机抽奖

界面图片:

HTML代码:

<div id="title">
    抽奖
</div>
<div id="luck">
    幸运儿
</div>
<ul id="box">
    <li>1号</li>
    <li>2号</li>
    <li>3号</li>
    <li>4号</li>
    <li>5号</li>
    <li>6号</li>
    <li>7号</li>
    <li>8号</li>
    <li>9号</li>
    <li>10号</li>
    <li>11号</li>
    <li>12号</li>
    <li>13号</li>
    <li>14号</li>
    <li>15号</li>
    <li>16号</li>
    <li>再试一次</li>
</ul>
<div id="text_box">就决定是</div><p id="text"></p><div id="text_box2">了!</div>

JS代码:

window.οnlοad=function () {
    var box = document.getElementById("box");      
    var name = box.getElementsByTagName("li");
    var yy = document.getElementById("title");
    var luck = document.getElementById("luck");
    var text=document.getElementById("text");
    yy.onclick = function () {                     
        time = setInterval(run, 50);
        function run() {
            numb = Math.floor(Math.random() * 17);
            for (var i = 0; i < name.length; i++) {
                name[i].style.borderColor = "white";
                text.innerText="";
            }
            name[numb].style.borderColor = "yellow";
            return time;
        }
    };
    luck.οnclick=function () {
        clearInterval(time);
        text.innerText=name[numb].innerText;
        text.style.color="gold";
    }

}












评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值