实现课堂随机点名和顺序点名

最新推荐文章于 2024-05-12 22:40:03 发布
最新推荐文章于 2024-05-12 22:40:03 发布
阅读量9.1k 收藏 11
点赞数 4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_21923867/article/details/60881682
版权
1. 效果：

ScreenGif.gif

2. Html代码：

<body>
<form>
    <div align="center">
        <input type="button" value="开始点名" onclick="students()" class="ks"/>
        <input type="button" value="停止点名" onclick="stop()" class="ks" id="nu"/>
        <hr color="blue">
        <br>
        <div id="div1" align="center">随机点名区域</div>
    </div>

</form>
</body>
3. JavaScript代码：
<script type="text/javascript">

        var i = 0;
        //t用来接收setTimeOut()的返回值
        var t;

        var st = ['张三','李四', '老王','旺财','铁柱', '王八','来福','小明','小红','狗蛋','SB.Child'];
        var u;

        //点名函数
        function students()
        {

            //顺序点名
        /*    if (i < st.length)
            {
                u = st[i];
            }
            else
            {
                //点到最后一个就回来重新点起
                i = 0;
                u = st[i];
            }
            i = i + 1;
*/
            //随机点名 产生0-数组长度之间的数作为数组下标
            var num = Math.floor(Math.random()*st.length);
            u = st[num];

            //更改文本框显示的value值
            document.getElementById("div1").innerHTML = u ;

            t = setTimeout("students()", 1000);
        }

        //停止点名函数
        function stop()
        {
            clearTimeout(t);
        }

        </script>
4. CSS代码：
<style type="text/css">
    body{
        background: #f5faff;
    }

    .ks{
        width: 140px;
        line-height: 55px;
        text-align: center;
        font-weight: bold;
        color: #fff;
        text-shadow:2px 2px 2px #333;
        border-radius: 5px;
        margin:0 20px 20px 0;
        position: relative;
        overflow: hidden;
        background-color: limegreen;
        border:1px solid #d2a000;
        box-shadow: 0 1px 2px #fedd71 inset,0 -1px 0 #a38b39 inset,0 -2px 3px #fedd71 inset;
    }

    #nu{
        background-color: red;

    }
    #div1 { font:40px '微软雅黑';text-align: center; background-color: gainsboro;
        width: 60%;
        height: 60%;
        margin-bottom:20px;

    }
</style>
Charelesa
关注
  • 4
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
课堂随机点名模板
12-04
课堂随机点名，能够轻松实现上课随机点名，而且可以达到不重复
课堂随机点名器
11-26
这是偶然从网上下载的来自云南文山县一位penglaoshi设计的课堂随机点名器，简单实用，可以自己修改文本文件里的学生姓名，点名时显示中文名字，学生非常喜欢。注意：两个文件要放在同一个目录下，否则会出错。
上课随机点名
Wrj6811的博客
10-06 1240
效果图： 页面代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>点名表</title> <link rel="stylesheet" href="../css/index.css"&g...
一起用Python做个上课点名器，好玩又实用！_python点名系统显示每一位同学的头像
最新发布
2401_84538185的博客
05-12 325
①　2000多本Python电子书（主流和经典的书籍应该都有了）②　Python标准库资料（最全中文版）③　项目源码（四五十个有趣且经典的练手项目及源码）④　Python基础入门、爬虫、web开发、大数据分析方面的视频（适合小白学习）⑤ Python学习路线图（告别不入流的学习）之前有读者反馈说，不知道程序中具体需要哪些模块、包文件，下面我就把程序中用到模块先放出来。主要包括了文件读写，随机数，PyQt5，win32con等。
Python——课堂随机点名
bulbboy的博客
12-05 2577
最近为了在课堂中提高学生的兴趣，使用python写了一个随机点名的小程序，正好python也是学生以后要学习的知识。
课堂随机点名系统（c#源码）
12-14
实现课堂随机点名，简单易用。直接读取文本文件。实现不重复点名。可以查询清空点名记录。可以选择不同点名班级名单。全源码提供。
JS实现课堂随机点名和顺序点名
10-20
主要介绍了基于JS实现课堂随机点名和顺序点名的相关资料，非常不错，具有参考借鉴价值，需要的朋友参考下
js实现课堂随机点名系统
10-15
主要介绍了js实现课堂随机点名系统，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
javascript如何使用函数random来实现课堂随机点名方法详解
10-15
为了实现课堂随机点名，我们可以利用`Math.random()`生成一个范围内的随机数，并结合数组索引来选择一个随机的名字。 在上述示例代码中，首先定义了一个数组`s`，包含了五个学生的名字——张三、李四、王五、王二、...
基于Java的课堂_随机点名器
03-26
随机点名器是一个能够从Excel文件的某个Sheet中读出班级所有同学的名单，然后通过产生一个随机数选中其中一个同学回答问题，然后输入回答问题的得分，并将该得分存入Excel表的另外一个Sheet中的简单程序。 实现要点：通过开源项目jExcel提供的jxl.jar包，实现Excel文件的读写。
Vue:使用Vue实现随机点名效果
changpili123456的博客
10-15 1554
使用Vue实现随机点名效果
C#做的随机点名程序
05-11
嘿嘿。。。 C#做的简单的点名程序，快来看看吧
python写一个随机点名软件的实例
09-18
今天小编就为大家分享一篇python写一个随机点名软件的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
课堂随机点名系统
s_meng_的博客
10-16 1128
出发点, 上课时老师说想要一个随机点名系统, 问有谁会做, 写一个出来用用, 我下课后就尝试写了一下, 之前写过一个类似的, 当时不能上传名单, 这次可以上传名单进行点名. 主要难点在于js对excel的读取, 获取其中的内容, 用了很长时间在网上需要教程, 各大视频网站都找了一遍, 未找到关于js处理excel的教程, 就去查找代码. 最后在一个阿里云的一个网站还是什么, 具体我忘了, 摘取了可以处理excel代码, 然后自己做了修改后可以使用. 不要问我为什么不去查阅文档, 英语不好, 文档也看不明白,
1024程序节|你知道老师上课随机点名是怎么实现的吗
m0_67388084的博客
10-22 3033
身为程序员的你 ，在老师使用工具随机摇人的时候，你是心里紧张的默念“抽不到我，抽不到我”，还是在琢磨老师的随机点名是如何实现的呢？今天这篇文章将为你揭露点名的“真相”......
vue随机姓名
icecreamgaga的博客
11-07 1805
getName(event) { let colors = [‘red’, ‘orange’, ‘green’, ‘blue’, ‘pink’, ‘purple’]; let k = parseInt(Math.random() * colors.length); let color = colors[k]; let names = this.userNameLists; let l = pars...
老师课堂随机点名代码
songJunFeng1的博客
02-04 2129
老师课堂随机点名代码 核心思路：利用Math.random()随机数的方法提取数组中的数据 <body> <div id="md">全班学生：</div> <button>点击随机抽取回答问题</button> <div class="zhong"></div> <script> var arr = ['若烟', '之瑶', '冰露', '谷雪', '李武', '
elementui vue的html随机点名器软件网页版源码1.1
qq_42553504的博客
05-09 1151
**在之前基础上新增了点击开始点名之后，判断姓名池的数量的判断，如果数量为零给出提示。 按钮的双击， 如果是在姓名池，在会进入上面的被点名状态， 如果是在上面卡片中的点名状态，则会重新回到姓名池 ** HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="js/Vue.jsv2.6.12.j...
基于html和vue的随机点名器
weixin_45387541的博客
05-26 1784
随机点名器：简便高效的点名工具
用jiva实现随机点名
03-25
Jiva是一个开源的Java虚拟机实现，它并不直接提供随机点名的功能。但是，你可以使用Jiva来编写一个Java程序来实现随机点名的功能。下面是一个简单的示例代码： ```java import java.util.ArrayList; import java....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值