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,使用方式都一样。
  • 支持主题名称、背景切换、抽奖用户是否可以重复中奖、抽奖页面样式美观…


相关文章
|
6月前
简约的域名主页HTML源码带暗黑模式
简约的域名主页HTML源码带暗黑模式
165 17
|
5月前
简约404错误页面HTML源码
简约404错误页面HTML源码
194 12
|
6月前
HTML单页在线自适应拟态影院源码
HTML单页在线自适应拟态影院源码
159 25
|
6月前
随机二次元背景毛玻璃个人导航HTML源码
随机二次元背景毛玻璃个人导航HTML源码
471 18
|
6月前
HTML单页自适应网址导航源码
HTML单页自适应网址导航源码
207 1
|
6月前
|
移动开发 前端开发 JavaScript
HTML5实现好看的劳动节网页源码
HTML5实现好看的劳动节网页源码,劳动节网页,劳动节网页源码,内置十个页面,各种模板都有,可以根据这些页面扩展更多页面,网页由网站首页、劳动节介绍、劳动节由来、劳动节习俗、劳动节文化、劳动节活动、劳动节故事、劳动节民谣、联系我们、登录/注册等页面组成,兼容手机端,页面干净整洁,内容丰富,可以扩展自己想要的,注释完整,代码规范,各种风格都有,代码上手简单,代码独立,可以直接运行使用。也可直接预览效果。
216 4
|
6月前
|
移动开发 HTML5
HTML5实现好看的中秋节网页源码
HTML5实现好看的中秋节网页源码,中秋节网页,中秋节网页源码,节日网页大作业,作业源码,内置十个页面,各种模板都有,可以根据这些页面扩展更多页面,网页由网站首页、中秋节介绍、中秋节由来、中秋节习俗、中秋节文化、中秋节美食、中秋节故事、中秋节民谣、联系我们、登录/注册等页面组成,兼容手机端,页面干净整洁,内容丰富,可以扩展自己想要的,注释完整,代码规范,各种风格都有,代码上手简单,代码独立,可以直接运行使用。也可直接预览效果。
351 0
HTML5实现好看的中秋节网页源码
|
7月前
简洁的个人地址发布页HTML源码
简洁的个人地址发布页HTML源码
77 0
|
3月前
|
移动开发 前端开发 JavaScript
征信报告修改器,征信报告生成器,制作软件无痕修改软件【js+html+css】
本项目为信用评分模拟器教学工具,采用HTML5实现,仅供学习参考。核心功能通过JavaScript构建,包含虚拟数据生成、权重分配及信用因素分析(如还款记录、信用使用率等)。