自动生成考号的小技巧

已于 2024-07-03 22:24:36 修改
阅读量187 收藏
点赞数 2
分类专栏： 常用技巧 文章标签： javascript 前端 html
于 2024-05-17 09:11:50 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hbqjzx/article/details/138992302
版权

生成考号的需要，弄一个网页来解决。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>莫卡乐-考号生成器</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f0f4f8;
            margin: 0;
            padding: 20px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-top: 50px; /* 添加此行 */
        }

        h1 {
            color: #333;
        }

        textarea {
            width: 100%;
            max-width: 600px;
            height: 350px;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
            margin-bottom: 20px;
            font-size: 16px;            
        }

        button {
            padding: 10px 20px;
            margin: 5px;
            border: none;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            background-color: #007bff;
            color: #fff;
            transition: background-color 0.3s;
        }

        button:hover {
            background-color: #0056b3;
        }

        table {
            width: 100%;
            max-width: 800px;
            border-collapse: collapse;
            margin-top: 20px;
        }

        th, td {
            border: 1px solid #ccc;
            padding: 10px;
            text-align: center;
        }

        th {
            background-color: #007bff;
            color: #fff;
        }

        tr:nth-child(even) {
            background-color: #f2f2f2;
        }

        @media (max-width: 600px) {
            textarea {
                height: 150px;
            }

            button {
                width: 100%;
                margin: 5px 0;
            }

            table, th, td {
                font-size: 14px;
            }
        }
        footer {
            margin-top: 20px;
            font-size: 14px;
            color: #666;
        }
    </style>
</head>
<body>
    <h1>考号生成器</h1>    
    <textarea id="examInput" placeholder="1 30&#10;2 30&#10;3 30&#10;4 50&#10;5 50"></textarea><br>

    <span><button onclick="generateExamSeats()">生成考号</button>
    <button onclick="clearExamSeatsData()">清除数据</button></span>
    <table>
        <thead>
            <tr>
                <th>考场号</th>
                <th>座位号</th>
                <th>考号</th>
            </tr>
        </thead>
        <tbody id="examData">
            <!-- Data will be inserted here -->
        </tbody>
    </table>
    <div id="toast" style="display: none; position: fixed; top: 20px; left: 50%; transform: translateX(-50%); background-color: #666; color: #fff; padding: 10px 20px; border-radius: 5px; font-size: 14px; z-index: 1000;">
    </div>
    <footer>© <span id="year"></span> <a href="https://mj.morecale.com/">莫卡乐</a></footer>

    <script>
        function generateExamSeats() {
            const input = document.getElementById('examInput').value.trim();
            if (!input) {
                alert("请输入考场数据，每行格式为：考场号 考生数（例如：1 30）");
                return;
            }
            
            const lines = input.split('\n');
            const exams = [];
            for (let line of lines) {
                const parts = line.trim().split(/\s+/);
                if (parts.length !== 2 || isNaN(parseInt(parts[0], 10)) || isNaN(parseInt(parts[1], 10))) {
                    alert(`无效输入: '${line}'。请确保每行格式正确，如 '1 30'。`);
                    return;
                }
                exams.push({
                    examNumber: parseInt(parts[0], 10),
                    examCount: parseInt(parts[1], 10)
                });
            }

            const table = document.getElementById('examData');
            table.innerHTML = ''; // 清空当前数据
            exams.forEach(exam => {
                const examNumber = exam.examNumber.toString().padStart(2, '0');
                for (let i = 1; i <= exam.examCount; i++) {
                    const seatNumber = i.toString().padStart(2, '0');
                    const combined = examNumber + seatNumber;
                    const row = table.insertRow();
                    row.insertCell(0).textContent = examNumber;
                    row.insertCell(1).textContent = seatNumber;
                    row.insertCell(2).textContent = combined;
                }
            });
            // alert("生成考号成功！");
            showToast("生成考号成功！", 2000);  // 显示2秒
        }

        function showToast(message, duration) {
            var toast = document.getElementById('toast');
            toast.textContent = message;
            toast.style.display = 'block';
                
            setTimeout(function() {
                toast.style.display = 'none';
            }, duration);
        }

        function clearExamSeatsData() {
            const table = document.getElementById('examData');
            table.innerHTML = ''; // Clear all data
        }

        // Function to set current year in footer
        function setCurrentYear() {
            const yearSpan = document.getElementById('year');
            yearSpan.textContent = new Date().getFullYear();
        }

        // Set the current year when the page loads
        window.onload = setCurrentYear;
    </script>
</body>
</html>

在线使用：如果有能帮到你，就来这里点个赞吧！

https://chat.morecale.com/exam.html

今天突然来用的时候，发现需要生成一个3位的座位号，修改了一下，更方便一些了。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>莫卡乐-考号生成器</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f0f4f8;
            margin: 0;
            padding: 20px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-top: 50px;
        }

        h1 {
            color: #333;
        }

        textarea {
            width: 100%;
            max-width: 600px;
            height: 350px;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
            margin-bottom: 20px;
            font-size: 16px;            
        }

        button {
            padding: 10px 20px;
            margin: 5px;
            border: none;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
            background-color: #007bff;
            color: #fff;
            transition: background-color 0.3s;
        }

        button:hover {
            background-color: #0056b3;
        }

        table {
            width: 100%;
            max-width: 800px;
            border-collapse: collapse;
            margin-top: 20px;
        }

        th, td {
            border: 1px solid #ccc;
            padding: 10px;
            text-align: center;
        }

        th {
            background-color: #007bff;
            color: #fff;
        }

        tr:nth-child(even) {
            background-color: #f2f2f2;
        }

        @media (max-width: 600px) {
            textarea {
                height: 150px;
            }

            button {
                width: 100%;
                margin: 5px 0;
            }

            table, th, td {
                font-size: 14px;
            }
        }
        footer {
            margin-top: 20px;
            font-size: 14px;
            color: #666;
        }
    </style>
</head>
<body>
    <h1>考号生成器</h1>    
    <textarea id="examInput" placeholder="1 30&#10;2 30&#10;3 30&#10;4 50&#10;5 50"></textarea><br>

    <label><input type="checkbox" id="threeDigitOption"> 三位考号</label>
    <label><input type="checkbox" id="yearOption"> 增加年份</label><br>
    
    <span>
        <button onclick="generateExamSeats()">生成考号</button>
        <button onclick="clearExamSeatsData()">清除数据</button>
        <button id="exportButton" onclick="exportToExcel()" style="display: none;">导出考号</button>
    </span>
    <table>
        <thead>
            <tr>
                <th>考场号</th>
                <th>座位号</th>
                <th>考号</th>
            </tr>
        </thead>
        <tbody id="examData">
            <!-- Data will be inserted here -->
        </tbody>
    </table>
    <div id="toast" style="display: none; position: fixed; top: 20px; left: 50%; transform: translateX(-50%); background-color: #666; color: #fff; padding: 10px 20px; border-radius: 5px; font-size: 14px; z-index: 1000;">
    </div>
    <footer>© <span id="year"></span> <a href="https://mj.morecale.com/">莫卡乐</a></footer>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.17.0/xlsx.full.min.js"></script>
    <script>
        function generateExamSeats() {
            const input = document.getElementById('examInput').value.trim();
            const threeDigitOption = document.getElementById('threeDigitOption').checked;
            const yearOption = document.getElementById('yearOption').checked;
            const year = new Date().getFullYear().toString();
            
            if (!input) {
                alert("请输入考场数据，每行格式为：考场号 考生数（例如：1 30）");
                return;
            }
            
            const lines = input.split('\n');
            const exams = [];
            for (let line of lines) {
                const parts = line.trim().split(/\s+/);
                if (parts.length !== 2 || isNaN(parseInt(parts[0], 10)) || isNaN(parseInt(parts[1], 10))) {
                    alert(`无效输入: '${line}'。请确保每行格式正确，如 '1 30'。`);
                    return;
                }
                exams.push({
                    examNumber: parseInt(parts[0], 10),
                    examCount: parseInt(parts[1], 10)
                });
            }

            const table = document.getElementById('examData');
            table.innerHTML = ''; // 清空当前数据
            exams.forEach(exam => {
                const examNumber = exam.examNumber.toString().padStart(2, '0');
                for (let i = 1; i <= exam.examCount; i++) {
                    const seatNumber = i.toString().padStart(threeDigitOption ? 3 : 2, '0');
                    const combined = (yearOption ? year : '') + examNumber + seatNumber;
                    const row = table.insertRow();
                    row.insertCell(0).textContent = examNumber;
                    row.insertCell(1).textContent = seatNumber;
                    row.insertCell(2).textContent = combined;
                }
            });

            document.getElementById('exportButton').style.display = 'inline';  // 显示导出按钮
            showToast("生成考号成功！", 2000);  // 显示2秒
        }

        function showToast(message, duration) {
            var toast = document.getElementById('toast');
            toast.textContent = message;
            toast.style.display = 'block';
                
            setTimeout(function() {
                toast.style.display = 'none';
            }, duration);
        }

        function clearExamSeatsData() {
            const table = document.getElementById('examData');
            table.innerHTML = ''; // Clear all data
            document.getElementById('exportButton').style.display = 'none';  // 隐藏导出按钮
        }

        function exportToExcel() {
            const table = document.getElementById('examData');
            const rows = table.getElementsByTagName('tr');
            const data = [];

            for (let i = 0; i < rows.length; i++) {
                const cells = rows[i].getElementsByTagName('td');
                const rowData = [];
                for (let j = 0; j < cells.length; j++) {
                    rowData.push(cells[j].innerText);
                }
                data.push(rowData);
            }

            const ws = XLSX.utils.aoa_to_sheet([
                ['考场号', '座位号', '考号'],
                ...data
            ]);

            const wb = XLSX.utils.book_new();
            XLSX.utils.book_append_sheet(wb, ws, '考号数据');
            XLSX.writeFile(wb, 'exam.xls');
        }

        // Function to set current year in footer
        function setCurrentYear() {
            const yearSpan = document.getElementById('year');
            yearSpan.textContent = new Date().getFullYear();
        }

        // Set the current year when the page loads
        window.onload = setCurrentYear;
    </script>
</body>
</html>

https://chat.morecale.com/examnew.html

hbqjzx
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
HTML5和CSS3 WEB技术开发
张晨光老师的播客
01-02 5966
B站视频参考：https://www.bilibili.com/video/BV1H44y1k7ze/[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uwbid43Z-1672665963237)(asseits/image-20210831212039584.png)]HTML:超文本标记语言(Hyper Text Markup Language)，标准通用标记语言下的一个应用。 HTML 不是一种编程语言（C、Java、python、R等），而是一种标记语言 (markup
考号打印工具
03-30
考号打印工具的核心功能在于快速导入和处理学生信息，生成清晰易读的考号布局，便于批量打印。其主要依赖于两个关键文件：`考号.xls` 和 `考号打印.exe`。 `考号.xls` 是一个Excel表格文件，用于存储学生的姓名、...
Excel使用技巧
打杂人
06-05 6504
Excel使用技巧 在工作当中用电子表格来处理数据将会更加迅速、方便，而在各种电子表格处理软件中，Excel以其功能强大、操作方便著称，赢得了广大用户的青睐。虽然Excel使用很简单，不过真正能用好Excel的用户并不多，很多人一直停留在录入数据的水平，本文将向你介绍一些非常使用的技巧，掌握这些技巧将大大提高你的工作效率。 ⒈快速定义工作簿格式 ⒉快速复制公式 ⒊快速显示单
基于SSM的计算机等级考试报名系统+09815（免费领源码）可做计算机毕业设计JAVA、PHP、爬虫、APP、小程序、C#、C++、python、数据可视化、大数据、全套文案
BS53804的博客
06-09 947
计算机等级考试报名系统主要功能模块包括轮播图（轮播图管理）考试公告管理（考试公告）资源管理（考试资讯、资讯分类）系统用户（管理员、考生用户）模块管理（报考等级、院系管理、考试信息、考试报名、考试安排、留言反馈）采取MySQL作为后台数据的主要存储单元，采用SSM框架、Java技术、Ajax技术进行业务系统的编码及其开发，实现了本系统的全部功能。
值得你收藏的办公技巧：word和execl使用技巧
yihuliunian的博客
04-13 667
转载自品略图书馆http://www.pinlue.com/article/2019/12/0309/0310161570850.html 1、Word下如何使用着重号 在Word中我们可以把着重号请到工具栏上。打开“工具—自定义”命令选项，打开“自定义”对话框。在“命令”标签卡下的“类别”栏里选中“所有命令”选项。此时在右边“命令”栏中会出现按字母升序排列的所有命令，我们找到ABC头上有三...
VFP自动编排考场座号小程序_vfp排考号_vfp考场编排_VFP自动编排考场座号小程序_vfp编排考场_
09-30
在提供的文件列表中，"VF打印考号程序代码.rar"可能包含了实现以上功能的源代码，用户可以通过阅读和理解代码来学习VFP的编程技巧，或者直接运行和修改代码以适应自己的需求。而"VFP自动编排考场座号小程序.txt"则...
一种在SQL Server中实现考号的批量生成算法.pdf
09-19
一种在SQL Server中实现考号的批量生成算法.pdf
考试类精品--answer card, 答题卡检测、试题切分、学生考号识别、选择题自动批改.zip
02-06
【标题】中的“考试类精品--answer card”指的是一个专门针对考试场景的解决方案，它涵盖了答题卡检测、试题切分、学生考号识别以及选择题自动批改等多个关键环节。这个系统旨在提高考试的自动化程度，减少人工干预...
高考贴心小技巧：考试答题与试卷检查注意事项作文.doc
03-07
在高考这个重要的节点，考生们不仅需要扎实的知识基础，还需要掌握一些答题和试卷检查的技巧，以确保在考试中能够发挥最佳...遵循这些小技巧，考生可以在高考中更加从容，提高答题的准确性和效率，从而获得理想的成绩。
PS2022免安装绿色版
hbqjzx的专栏
11-03 4861
10月，Adobe更新全系产品至2022版，Adobe旗下的产品深入多媒体领域的方方面面，对于大家来说，用的最多的当属Photoshop。 Photoshop的相关资源，目前在国内主要是由@vposy封装制作，它的优点显而易见，封装的版本均为直装版，可更改安装路径，且无需安装ACC组件，简单直接，是最为推荐的版本。 各种经典的免安装版绿色精简版同样也深受大家的喜爱，下面分享的是本人用过的感觉还不错的绿色版。 以上四个版本均是适度精简，去除的组件属于可有可无的，最关键的是稳定，解压后
HBuilder X 快捷键，多行代码右移动，左移动
hbqjzx的专栏
01-20 2518
HBuilder X 快捷键，Shift + tab 左移tab 右移若要实现 多行左右移，选中想要移动的用Shift + tab或tab就行了。
Linux与windows相比有何优势，看完就明白了
hbqjzx的专栏
11-15 2141
Linux和Windows是两种操作系统，对于服务器运维的人来说，在为服务器选择操作系统系统的时候，是选择Linux还是Windows是让人困惑的事？ 从用户群来说Linux是一个以开发者为中心的操作系统，而windows是以消费者为中心的操作系统，这也是两个操作系统作为根本的区别。简单来讲，两个系统的选择就是看你是开发用还是作为消费者使用。 具体到Linux与Windows的优缺点，可以总结为一下几点 1.Linux可以看到源代码，windows不行。 这一点直接导致的结果就是在特殊应用的场合可以
浏览器如何模拟手机微信-另类解决微信视频号下载问题
hbqjzx的专栏
05-10 2096
近来，有下载微信视频号视频的需求，在网上翻找了一通，不是下载不了，就是要收费，本来共享、免费的精神。终于。。。。 首先，将浏览器设置一下备用： 模拟微信浏览器： 1、打开360极速 2、F12开发者工具 3、开发者模式左上方有一个手机样子的图标 点击进入 设备模式‘ 4、将UA选项中的字符串替换成： Mozilla/5.0 (iPhone; CPU iPhone OS 6_1_3 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Mobile/
如何使用 Python 爬取微信公众号文章
hbqjzx的专栏
11-03 1428
我比较喜欢看公众号，有时遇到一个感兴趣的公众号时，都会感觉相逢恨晚，想一口气看完所有历史文章。但是微信的阅读体验挺不好的，看历史文章得一页页的往后翻，下一次再看时还得重复操作，很是麻烦。 于是便想着能不能把某个公众号所有的文章都保存下来，这样就很方便自己阅读历史文章了。 话不多说，下面我就介绍如何使用 Python 爬取微信公众号所有文章的。 主要有以下步骤： 1 使用 Fiddler 抓取公众号接口数据 2 使用 Python 脚本获取公众号所有历史文章数据 3 保存历史文章 Fiddler
3分钟掌握Suno API！音痴也能创作热门曲！免费拥有个人爆款音乐！
hbqjzx的专栏
05-11 1225
如果想自定义生成歌词，可以输入歌词：这时候lyric注意，这里的歌词中\n是换行符，如果你不知道如何生成歌词，可以使用下文介绍的生成歌词的 API 自助生成。lyric：歌词文本custom：填写为true，代表自定义生成，该参数默认为 false，代表使用prompt生成。file：歌曲的标题。style：歌曲的风格，选填。填写样例如下：填写完毕之后自动生成了代码如下：-d '{}'测试允许，生成的效果是类似的。
限时删除！能挑战IDM，最快33M/S
hbqjzx的专栏
10-28 1138
互联网的老司机们没人不知道IDM吧，它的全称是Internet Download Manager（简称 IDM），堪称是“地表最强下载神器”，说这话没人反驳吧！ 不过看了今天小编要推荐的软件，“地表最强下载神器”IDM的地位就有点不稳了。为了防止有些小伙伴没用过IDM，这里就再简单介绍下。 IDM是一款多线程下载工具，有了它能够让你的下载速度提升5倍之多，没有丝毫吹牛。 除了下载加速之外，还提供自动链接捕获、站点抓取、视频音频下载、国外网盘加速下载等功能...
配置Nginx 在服务器重启后自动启动
最新发布
hbqjzx的专栏
06-19 200
找到 Nginx 服务，点击设置。通过以上配置，应该能够解决 Nginx 服务在服务器重启后无法自动启动的问题。记录一下，配置Nginx 在服务器重启后自动启动，可以通过配置 systemd 服务来实现。宝塔面板中的设置： 如果你使用的是宝塔面板，也可以通过宝塔面板的服务管理功能设置 Nginx 服务的自启动。这个命令会创建相应的符号链接，使 Nginx 服务在每次系统启动时自动启动。这将有助于诊断 Nginx 服务启动失败的具体原因。如果 Nginx 正常运行，你应该会看到其状态。
用python写一个考号编排程序
08-24
考号编排程序是用来对考生的考号进行自动编排的程序。在编写这个程序时，我们可以利用Python编程语言来实现。 首先，我们需要确定考号的编号规则。例如，考号由数字和字母组成，长度为10，并且后三位数字表示考场号...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

hbqjzx

你的鼓励将是我分享的最大动力！

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值