JS 随机数字抽签

时间：2014-12-13 20:32:04 阅读：359 评论：0 收藏：0 [点我收藏+]

标签：style blog http io ar color sp for java

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="Scripts/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        var numArray = new Array();

        var personNum = 30;
        $(function () {
            for (var i = 0; i < personNum; i++) {
                numArray[i] = i;
            }

            $("li").click(function () {
                var n = Math.floor(Math.random() * numArray.length + 1) - 1;  //生成随机数
                $(this).text(numArray[n]);
                numArray.splice(n, 1);  //移除随机数

            });

            $("#btnStart").click(function () {
                var totalArray = new Array();
                $("li").each(function (i, v) {
                    totalArray[i] = v.innerText;
                });

                var n = Math.floor(Math.random() * totalArray.length + 1) - 1;  //生成随机数
                this.value = totalArray[n];

                $("li").each(function (i, v) {
                    if (v.innerText == $("#btnStart").val()) {
                        this.style.background = "red";
                    }
                    else
                    {
                        this.style.background = "white";
                    }
                });

            });
        });


    </script>
    <style type="text/css">
        ul {
            /*display: block;
            float:left;*/
        }

            ul li {
                width: 150px;
                height: 150px;
                line-height: 150px;
                border: 1px solid gray;
                float: left;
                margin-left: 10px;
                margin-top: 10px;
                list-style-type: none;
                text-align: center;
                font-size: 20px;
            }

        #btnStart {
            width: 100px;
            height: 30px;
            margin-left: 10px;
            margin-top: 10px;
        }
    </style>
</head>
<body>

    <div>
        <ul>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
        </ul>
        <ul>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
        </ul>
        <ul>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
        </ul>
        <ul>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
        </ul>
        <ul>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
            <li>click me!</li>
        </ul>
    </div>

    <input id="btnStart" type="button" value="Start" />
</body>

</html>

JS 随机数字抽签

标签：style blog http io ar color sp for java

原文地址：http://www.cnblogs.com/gossip/p/4161787.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行