扣奖(定时器)

简介: 扣奖(定时器)
<input type = "number"id = "qaz"value = "" >
    <button onclick = "fu()"id = "yhn" > 提交 < /button> 
<input type = "text"value = "0"id = "rfv"style = "display: none;"readonly ="readonly" >
    <button id = "edc"style = "display: none;" > 抽奖 < /button>

加 display:none 让他们两个隐藏起来,达到一定条件再显示出来

let qaz = document.getElementById("qaz");
    let edc = document.getElementById("edc");
    let rfv = document.getElementById("rfv");
    let yhn = document.getElementById("yhn");
    edc.onclick = function() {
      rfv.value++;
    }
    function fu() {
      if (qaz.value <= 17) {
        alert('未成年');
      } else if (qaz.value >= 18 && qaz.value < 40) {
        alert('青少年');
      } else if (qaz.value >= 40 && qaz.value < 60) {
        alert('中年');
      } else if (qaz.value >= 60 && qaz.value <= 100) {
        alert('低保户');
        edc.style.display = "inline-block";
        rfv.style.display = "inline-block";
        setTimeout(function() {
          if (rfv.value > 20 && rfv.value < 30) {
            alert('抽奖成功');
            edc.style.display = "none";
            rfv.style.display = "none";
            qaz.style.display = "none";
            yhn.style.display = "none";
          } else if (rfv.value >= 30 && rfv.value < 40) {
            alert('B');
            edc.style.display = "none";
            rfv.style.display = "none";
            qaz.style.display = "none";
            yhn.style.display = "none";
          } else if (rfv.value >= 40 && rfv.value <= 50) {
            alert('A');
            edc.style.display = "none";
            rfv.style.display = "none";
            qaz.style.display = "none";
            yhn.style.display = "none";
          } else if (rfv.value > 50) {
            alert('SSS');
            edc.style.display = "none";
            rfv.style.display = "none";
            qaz.style.display = "none";
            yhn.style.display = "none";
          } else {
            alert('失败');
            edc.style.display = "none";
            rfv.style.display = "none";
            qaz.style.display = "none";
            yhn.style.display = "none";
          }
        }, 5000)
      }
    }

获取过来标签,判断value值可不可以抽奖可以显示,不可以弹出alert;

获取过来标签,加上点击事件,使value的值加加

设置一个定时器 几秒后执行(以毫秒为单位1秒等于一千毫秒),执行的什么

判断达不达标,达标怎么样,不达标怎么样

相关文章
|
11月前
|
数据采集 数据挖掘 数据处理
如何使用 Pandas 库进行数据清洗和预处理?
数据清洗和预处理是数据分析中至关重要的步骤,Pandas库提供了丰富的函数和方法来完成这些任务
548 64
|
11月前
|
人工智能 搜索推荐 物联网
Android系统版本演进与未来展望####
本文深入探讨了Android操作系统从诞生至今的发展历程,详细阐述了其关键版本迭代带来的创新特性、用户体验提升及对全球移动生态系统的影响。通过对Android历史版本的回顾与分析,本文旨在揭示其成功背后的驱动力,并展望未来Android可能的发展趋势与面临的挑战,为读者呈现一个既全面又具深度的技术视角。 ####
|
8月前
|
人工智能 运维 资源调度
AI 赋能混合云运维:告别手工操作,迈向智能自愈!
AI 赋能混合云运维:告别手工操作,迈向智能自愈!
415 85
|
存储 数据管理 BI
揭秘数据仓库的奥秘:数据究竟如何层层蜕变,成为企业决策的智慧源泉?
【8月更文挑战第26天】数据仓库是企业管理数据的关键部分,其架构直接影响数据效能。通过分层管理海量数据,提高处理灵活性及数据一致性和安全性。主要包括:数据源层(原始数据)、ETL层(数据清洗与转换)、数据仓库层(核心存储与管理)及数据服务层(提供分析服务)。各层协同工作,支持高效数据管理。未来,随着技术和业务需求的变化,数仓架构将持续优化。
207 3
|
缓存 前端开发
ProFlow 流程编辑器框架问题之创建一个自定义节点如何解决
ProFlow 流程编辑器框架问题之创建一个自定义节点如何解决
141 1
|
11月前
|
移动开发 前端开发 API
React 拖拽组件 Drag & Drop
本文介绍了在 React 中实现拖拽功能的方法,包括使用原生 HTML5 Drag and Drop API 和第三方库 `react-dnd`。通过代码示例详细讲解了基本的拖拽实现、常见问题及易错点,帮助开发者更好地理解和应用拖拽功能。
869 10
|
SQL 安全 算法
带你读《代码管理实践10讲》——七、3类代码安全风险如何避免?
带你读《代码管理实践10讲》——七、3类代码安全风险如何避免?
318 0
|
JavaScript 前端开发 API
Vue.js 深度解析:nextTick 原理与应用
Vue.js 深度解析:nextTick 原理与应用
|
负载均衡 应用服务中间件 Nacos
最全解决:微服务之间调用出现Load balancer does not have available server for client
最全解决:微服务之间调用出现Load balancer does not have available server for client
3423 1
最全解决:微服务之间调用出现Load balancer does not have available server for client
|
Web App开发 安全 搜索推荐
魔改版谷歌浏览器,功能确实很强大
现在的浏览器,各有特色,以及主打的用户群定位都不一样。不知道大家喜欢哪一款?不过今天,我把我最常用也是最喜欢的一款推荐给大家,这款软件叫谷歌浏览器 。今天,就为大家推荐一款绿色魔改版的Chrome浏览器,保证让Chrome更加好用!