zoukankan      html  css  js  c++  java
  • 抽奖JQ

    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <title>抽签</title>
        <script src="jquery-3.4.1.min.js"></script>
    </head>
    <script>
        $(function () {
            var names = [
                "张三",
                "李四",
                "诸葛亮",
                "刘备",
                "曹操",
                "韩非",
                "张良",
                "卫庄",
                "盖聂",
            ];
            var time;
            var index;
            $("#start").prop("disabled", false);
            $("#stop").prop("disabled", true);
            $("#start").click(function () {
                time = setInterval(function () {
                    $("#start").prop("disabled", true);
                    $("#stop").prop("disabled", false);
                    index = Math.floor((Math.random() * 10) + 1);
                    $("#name").prop("value", names[index]);
                });
            });
            $("#stop").click(function () {
                clearInterval(time);
                $("#start").prop("disabled", false);
                $("#stop").prop("disabled", true);
            });
        });
    </script>

    <body>
        <input type="text" id="name" value="张三" style=" 250px;height: 50px;border: 2px solid black;text-align: center;
    margin-left:450px;margin-top: 100px;red;color: white; font-size: 26px">
        <input type="button" id="start" value="开始" style=" 70px;height: 35px; margin-left: 100px">
        <input type="button" id="stop" value="结束" style=" 70px;height: 35px;">
    </body>

    </html>
  • 相关阅读:
    leetcode——91.解码方法
    leetcode——64.最小路径和
    Layui上传图片2.0版
    LINQ中判断日期时间段
    Http基础
    Js中数组,字符串的常用方法
    C#数组,ArrayList,List区别
    08-01 通过线性回归了解算法流程
    08-00 课程习得
    C-02 推荐系统
  • 原文地址:https://www.cnblogs.com/yeyuyuni/p/11586576.html
Copyright © 2011-2022 走看看