本源码为纯前端实现的网页版叫号系统,采用HTML+CSS+JavaScript技术栈开发,无需后端支持即可运行。系统适配笔记本电脑与电视屏幕同屏显示场景,压缩包体积仅860KB,兼容Chrome/Firefox/Edge等主流浏览器。
▍核心功能模块
- 数据管理功能:
- 支持Excel/CSV格式学生名单导入(最大支持500人名单)
- 内置Fisher-Yates洗牌算法实现随机排序
- 实时显示待叫号队列剩余人数统计
- 叫号显示系统:
- 电视端全屏显示模式(自动隐藏浏览器控件)
- 当前叫号学生姓名72pt加粗显示
- 语音播报系统调用Web Speech API合成发音
- 操作控制面板:
- 开始/暂停叫号进度控制按钮
- 手动跳号功能(支持向前/向后调整)
- 紧急状态红色闪烁提示模式
▍技术实现特性
• 数据存储:使用localStorage持久化存储名单数据
• 语音引擎:优先调用Edge TTS,兼容Android TTS
• 响应式布局:基于Bootstrap 5实现多分辨率适配
• 性能优化:名单加载采用Web Worker后台处理
▍部署实施流程
- 文件部署:
- 解压源码包至任意Web服务器目录
- 设置display.html为电视屏默认页面
- 名单导入:
- 准备标准格式CSV文件(学号,姓名,班级)
- 通过控制台”导入数据”按钮上传文件
- 设备调试:
- 电脑端访问control.html进入控制台
- 电视端全屏显示display.html
- 双屏通过sessionStorage实时同步数据
系统内置三种显示主题:
- 医院蓝白标准样式
- 学校绿底黄字主题
- 高对比度黑白模式
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
评论(0)