基本信息
源码名称:简单的上课点名器
源码大小:2.20KB
文件格式:.html
开发语言:CSS
更新时间:2025-09-21
   友情提示:(无需注册或充值,赞助后即可获取资源下载链接)

     嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):813200300

本次赞助数额为: 1 元 
   源码介绍

一个简单的上课点名器 便于老师使用



<!DOCTYPE html> <html lang="zh-CN"> <head>  <meta charset="UTF-8">  <title>简单上课点名器</title>  <style>  body { font-family: "Microsoft YaHei", sans-serif; background-color: #f5f5f5; display: flex; justify-content: center; align-items: center; height: 100vh;
        }
        .container { background-color: #fff; padding: 30px 50px; border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,0.2); text-align: center;
        } h1 { margin-bottom: 20px; color: #333;
        } #nameDisplay { font-size: 2em; margin: 20px 0; color: #007BFF; min-height: 40px;
        } button { padding: 10px 20px; font-size: 1em; border: none; border-radius: 5px; background-color: #28a745; color: #fff; cursor: pointer; transition: background 0.3s;
        } button:hover { background-color: #218838;
        } input { padding: 5px; margin-bottom: 10px; width: 80%; font-size: 1em;
        } </style> </head> <body> <div class="container">  <h1>上课点名器</h1>  <input type="text" id="studentNames" placeholder="输入学生名字,用逗号分隔">  <div id="nameDisplay"></div>  <button onclick="pickRandomName()">随机点名</button> </div>  <script>  function pickRandomName() { const input = document.getElementById('studentNames').value; if(!input) { alert("请先输入学生姓名!"); return;
        } const names = input.split(',').map(name => name.trim()).filter(name => name); if(names.length === 0) { alert("请输入有效的学生姓名!"); return;
        } const randomIndex = Math.floor(Math.random() * names.length); document.getElementById('nameDisplay').textContent = names[randomIndex];
    } </script> </body> </html>