HTML5 网页端年会抽奖源码,导入名单列表即可使用

简介: HTML5 网页端年会抽奖源码,导入名单列表即可使用

一、使用效果

image.png


二、下载地址

三、使用方式(配置)

  • 下载项目后,通过浏览器打开 index.html 主入口,然后导入名单即可使用,也可以自定义奖项名称,内定中奖人员,不用担心误关窗口。
0、index.html: 主入口,lucky-draw.html 为抽奖页面。
1、误关抽奖窗口、刷新网页都不会导致丢失用户名单、中奖名单、剩余未中奖用户名单、奖项配置等,所以误操作也没事,可以重新在同一个浏览器中打开,再次进入抽奖页,继续操作即可,流程保持不变。
2、想要清空数据,必须在主页 index.html 中点击清空所有数据,才会清理用户名单、中奖名单、奖项配置等所有配置,相当于重置,否则在同一浏览器中会一直保留。
3、支持 .xlsx、.xls、.csv 文件格式上传
4、支持自定义奖项模式、默认抽奖模式
5、已经中过奖的人不会重复中奖
6、在上面支持的文件格式中每个单元格是一个用户
7、每个单元格支持的用户格式,可以混合存在文件中:
(没有设置指定第几轮中奖的会完全随机抽,所以不需要内定的时候,不要用设置第几轮中奖的名单方式就行了)
  名字
  名字-部门(或职位, 或描述)
  名字-第几轮中奖(只能数字,不设置随机)
  名字-部门(或职位, 或描述)
  名字-部门(或职位, 或描述)-第几轮中奖(只能数字,不设置随机)
  注意:第几轮中奖(只能数字,不设置随机) 这一项在自定义奖项模式、默认抽奖模式中用法一样,作用不同。
  默认抽奖模式:指的是第几轮中奖
  自定义奖项模式:这个模式下就不会按轮来进行中奖,对应的是自定义奖项时填写的标签,如果一个自定义奖项的标签设置为1,然后选择这个奖项抽奖时,用户列表里面有按上面模式设置了1的用户则会中奖,这个标签是可选项,不设置就完全随机,如果设置就会去名单列表中找到匹配的用户。
  例如:
  张三
  李四-1
  王五-财务部
  赵六-副总-2
  • 自定义奖项设置

  • 人员名单配置,内定配置规则

  • 可导出中奖名单(如果不小心误关抽奖窗口、刷新网页都不会导致丢失用户名单、中奖名单、剩余未中奖用户名单、奖项配置等,所以误操作也没事,可以重新在同一个浏览器中打开,再次进入抽奖页,继续操作即可,流程保持不变)。


四、扩展版本

  • 这里有一个优化版本,是由 shatinGitHub 进行优化,对布局做了调整,支持 手机竖屏下载地址,分支名称:shatin,使用方式都一样。
  • 支持主题名称、背景切换、抽奖用户是否可以重复中奖、抽奖页面样式美观…


相关文章
|
5天前
在线检测显示屏坏点html工具源码
在线检测显示屏坏点html工具源码
44 20
|
3天前
HTML在线扫雷游戏网页源码
HTML在线扫雷游戏网页源码是一款基于HTML+CSS+JavaScript开发的在线扫雷小游戏单页源码,为用户提供了一个无需安装即可在浏览器中直接玩的扫雷游戏。该游戏的源码不仅包含了完整的游戏逻辑,还具备丰富的界面设计和用户交互功能,使得玩家能够轻松上手并享受扫雷带来的乐趣。
32 22
|
6天前
一个好看的小时钟html+js+css源码
一个好看的小时钟html+js+css源码
79 24
|
15天前
|
数据采集 前端开发 数据挖掘
利用 html_table 函数轻松获取网页中的表格数据
本文介绍了如何使用 R 语言中的 `html_table` 函数结合代理 IP 技术,轻松提取网页表格数据并规避反爬机制。通过设置代理和请求头,示例代码展示了如何从 58 同城采集租房信息并保存为 CSV 文件。该方法适用于需要频繁采集数据的场景,确保数据采集的高效和稳定性。
利用 html_table 函数轻松获取网页中的表格数据
|
25天前
|
Web App开发 移动开发 HTML5
html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码
html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码。画面中心是悬浮于空的梅花鹿,其四周由白色线段组成了一个6边形将中心的梅花鹿包裹其中。四周漂浮的白雪随着多边形的转动而同步旋转。建议使用支持HTML5与css3效果较好的火狐(Firefox)或谷歌(Chrome)等浏览器预览本源码。
72 2
|
2月前
|
移动开发 JavaScript HTML5
HTML5实现2025雪花飘新年倒计时源码
2025年即将到来,此源码页为单html纯代码,新年倒计时,背景雪花飘落效果,倒计时时间日期在JS/app.js文件第21行代码自行修改即可!
249 7
|
2月前
斗地主单机游戏HTML源码
斗地主单机游戏HTML源码,可以作为课程设计项目参考,喜欢的朋友可以拿去
44 5
|
2月前
|
前端开发
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
30 0
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
|
2月前
|
移动开发 前端开发 HTML5
HTML5 Canvas制作的粒子十秒倒计时源码
一段基于HTML5 Canvas制作的粒子爆炸,十秒数字倒计时,全屏倒计时动画效果,给人一种非常大气的视觉感
39 0
HTML5 Canvas制作的粒子十秒倒计时源码
|
2月前
渐淡背景导航页HTML源码
每五秒进行淡进淡出切换背景图,适合作为个人引导页,喜欢的朋友拿去吧。
34 2