iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JS实现随机点名系统
  • 627
分享到

JS实现随机点名系统

2024-04-02 19:04:59 627人浏览 薄情痞子
摘要

用js实现一个随机点名系统,供大家参考,具体内容如下 每次上课前10分钟,老师都会叫我们回答问题,奈何每次都是点学号,好像每次我都能中奖,我直接跟老师提议,老师,我用来JS来帮你写个

js实现一个随机点名系统,供大家参考,具体内容如下

每次上课前10分钟,老师都会叫我们回答问题,奈何每次都是点学号,好像每次我都能中奖,我直接跟老师提议,老师,我用来JS来帮你写个随机点名的系统吧!这样就不会每次都抽到我了,哈哈

先看效果:

代码如下:


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

<head>
 <meta charset="UTF-8">
 <meta Http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
</head>

<body>
 <button id="box1">开始</button>
 <button id="box2">结束</button>
 <span id="box">Tom</span>

 <script>
  //获取页面中的元素

  var btn1 = document.getElementById('box1');
  var btn2 = document.getElementById('box2');
  var span = document.getElementById('box');
  var names = ['Tom', 'Jack', 'Lucy', 'Peter', 'Mark', 'Min', 'Liu', 'Rani'];
  var timer;

  btn1.onclick = function() {
   window.clearInterval(timer);

   timer = window.setInterval(countName, 100);
  };

  btn2.onclick = function() {
   window.clearInterval(timer);
  };

  function countName() {
   var index = parseInt(Math.random() * names.length);
   span.innerHTML = names[index];
  }
 </script>
</body>

</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程网。

--结束END--

本文标题: JS实现随机点名系统

本文链接: https://www.lsjlt.com/news/122766.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • JS实现随机点名系统
    用JS实现一个随机点名系统,供大家参考,具体内容如下 每次上课前10分钟,老师都会叫我们回答问题,奈何每次都是点学号,好像每次我都能中奖,我直接跟老师提议,老师,我用来JS来帮你写个...
    99+
    2022-11-12
  • JS如何实现课堂随机点名和顺序点名
    这篇文章主要介绍了JS如何实现课堂随机点名和顺序点名,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1. 效果:2. Html代码:<b...
    99+
    2022-10-19
  • 基于Python怎么实现随机点名系统
    效果展示创建一个这样的文件夹,然后把要随机点名的名字写在里面导入后,这里就显示你导入了多少人员信息点击开始点名后,会随机从导入名字里挑选一位幸运儿~效果大概就是这样,下面我们来看看代码吧代码展示导入模块里面有第三方模块,需要大家自己安装一下...
    99+
    2023-05-24
    Python
  • 基于Python实现随机点名系统的示例代码
    目录效果展示代码展示导入模块子线程调用应用初始化信息姓名信息布局开始信息布局数据信息布局整体布局运行 大家好,我是了不起! 在某些难以抉择得时候,我们经常要用外力来帮助我们...
    99+
    2023-05-14
    Python实现随机点名系统 Python随机点名系统 Python随机点名
  • JavaScript实现随机点名网页
    JavaScript写一个随机点名网页,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head> <m...
    99+
    2022-11-12
  • Python轻松写个课堂随机点名系统
    目录起因准备工作效果展示代码实战起因 刚上大学的表弟问我,大学准备好好玩玩,问我有没有什么不挂科的秘诀。 于是我连夜给表弟写了一个课堂点名系统,让他给每个任课老师都送一遍,方便老师就...
    99+
    2023-01-03
    Python课堂点名系统 Python点名系统
  • JavaScript实现表格表单的随机选择和简单的随机点名
    目录一、表格表单的随机选择1.H5的布局2.CSS布局3.JS的布局二、简单的随机点名1.H5布局2.CSS布局3.JS布局三、可以自己暂停的随机点名一、表格表单的随机选择 效果展示...
    99+
    2022-11-13
    JavaScript随机点名 JavaScript 表格随机选择
  • 基于C语言实现随机点名器(附源码)
    突发奇想写了个随机点名器…以供使用 随机点名器 main函数 #include "myList.h" #define FILENAME "stu.txt" voi...
    99+
    2022-11-13
  • js canvas实现随机粒子特效
    本文实例为大家分享了js canvas随机粒子特效的具体代码,供大家参考,具体内容如下 前言 canvas实现前端的特效美术 结果展示 代码 html <!DOCTYPE...
    99+
    2022-11-12
  • JS实现随机生成验证码
    本文实例为大家分享了JS实现随机生成验证码的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head>...
    99+
    2022-11-12
  • JS实现随机抽奖小功能
    本文实例为大家分享了JS实现随机抽奖小功能的具体代码,供大家参考,具体内容如下 点击开始按钮开始抽奖,div依次变红!下面是js代码,需要的自取 <script>    ...
    99+
    2022-11-12
  • python随机抽奖系统怎么实现
    要实现一个Python随机抽奖系统,可以按照以下步骤进行:1. 导入random模块,用于生成随机数。```pythonimport...
    99+
    2023-08-16
    python
  • Python实现上课点名器系统
    目录前言一、核心功能设计二、实现步骤1. UI排版布局设计2. 学生姓名加载3. 随机点名实现4. 连抽模式实现5. 抽取历史查看三. 打包配置总结前言 前段时间,用PyQt5写了几...
    99+
    2022-11-12
  • node.js + socket.io 实现点对点随机匹配聊天
    真心佩服那些可以经常发布笔记的人,其实我也想经常发来的,奈何技术不够加上懒,要向大神们多多学习了,前段时间有用bomb平台自带的socket写一个聊天室,其实基本就是改了改它的demo,这次想实现一个随机私...
    99+
    2022-06-04
    点对点 js node
  • python实战练习做一个随机点名的程序
    用python做一个简单的随机点名程序(不重复点名) 这是我来到csdn的第一篇文章,内容如果有瑕疵的地方或者代码可以进一步改善,请大家对我指点一二。谢谢!废话不多说,上代码! ...
    99+
    2022-11-12
  • C#实现绘制随机噪点和直线
    目录实践过程效果代码实践过程 效果 代码 public partial class Form1 : Form { public Form1() ...
    99+
    2023-01-05
    C#绘制随机噪点 直线 C#绘制随机噪点 C#绘制随机直线 C# 噪点 直线
  • JS实现数组随机排序的方法有哪些
    本篇内容介绍了“JS实现数组随机排序的方法有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!1.利用数组方法sort实现随机排序实现随机排...
    99+
    2023-06-30
  • 基于Python实现简单的学生点名系统
    目录本文背景效果展示实现方式1、读取excel表格2、搭建系统界面3、随机选择学生4、将代码打包成exe使用说明今年教师节前夕,我特意用Python做了个学生点名系统,非常好用,送给...
    99+
    2022-11-11
  • Win7系统使用JS脚本实现关机功能
     Win7 32位系统使用JS格式设置关机脚本分享给大家,操作系统过程中遇到关机的方法有很多种,比如通过Shutdown命令设置关机快捷方式,还可以使用js格式设置关机脚本,具体操作如下:1、按&ld...
    99+
    2023-06-14
    Win7系统 JS脚本 关机 脚本 JS 系统
  • JS实现数组随机排序的三种方法详解
    目录1.利用数组方法sort实现随机排序2.洗牌算法实现随机排序3.洗牌算法深入分析全部代码1.利用数组方法sort实现随机排序 实现随机排序方法还是很多的,用for循环是可以写的,...
    99+
    2022-11-13
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作