带饼干的倒计时器

2023-12-05

我知道有很多这样的话题,但我只是遇到问题,找不到答案。 我的脚本是:

window.onload = function(){
    // 200 seconds countdown
    var countdown = 14400; 
    //current timestamp
    var now   = Date.parse(new Date());

    //ready should be stored in your cookie
    if ( !document.cookie )
    {
        document.cookie = Date.parse(new Date (now + countdown  * 1000)); // * 1000 to get ms
    }

    //every 1000 ms
    setInterval(function()
    {
        var diff = ( document.cookie - Date.parse(new Date()) );

        if ( diff > 0 )
        {
            var message = diff/1000 + " seconds left";
        }
        else
        {
            var message = "finished";
        }

        document.body.innerHTML = message;

    },1000);
}

我想制作一个倒计时器,它根据用户的 cookie 值告诉用户还剩下多少时间。到目前为止,我设法计算两个值之间的差异,但我不知道如何根据差异时间戳(diff)制作类似“dd/mm/yy hh:mm:ss”的格式。有可能吗?


你想要的是一个将差异(毫秒)转换为类似的函数

5天4小时3米2秒

如果您不介意时间段>几个月有很多天,那么您可以使用如下内容:

function human_time_difference(diff) {
    var s = diff % 60; diff = Math.floor(diff / 60);
    var min = diff % 60; diff = Math.floor(diff / 60);
    var hr = diff % 24; diff = Math.floor(diff / 24);
    var days = diff;

    return days + 'd ' + hr + 'h ' + min + 'm ' + s + 's';
}

如果以毫秒为单位存在差异,则需要传递该数字除以 1000。您还可以使用 Math.round 来去掉分数,但如果您希望显示该信息,也可以保留它们。

由于以下几个原因,获取月份和年份有点棘手:

  1. 一个月的天数各不相同。
  2. 当您从一个月中旬到下一个月中旬时,即使天数 > 31,时间跨度也不会涵盖任何整月(例如,6 月 2 日到 6 月 2 日之间有多少个月) 7月30日??)。

如果您确实想要两次之间的月数,那么它们之间的秒数是不够的。您必须使用日历逻辑,这需要传入开始和结束日期+时间。

PS:当您发布问题时,请避免不相关的细节。例如,您的问题与 cookies、setInterval 或 onload 处理程序无关。您唯一不知道的部分是如何将(毫)秒转换为天、小时等。提供一些关于为什么您尝试做某事的背景可能会有所帮助,但如果不需要了解基本问题,把它放在最后,这样人们就不必在到达核心部分之前费力地阅读它。同样的建议也适用于您的头衔;通过排除不相关的细节(例如 cookie 和倒计时)来确保其相关。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

带饼干的倒计时器 的相关文章

  • 我如何能够以两行显示标题,并且每行的字体大小不同?

    我正在使用 Google Chart API 创建时间线图 并希望将图的标题修改为两行 问题 我如何能够显示具有不同字体大小的两线图表标题 电流输出 理想输出 相关研究 我唯一能找到的是有人试图用饼图来做到这一点 但我尝试了但无法使其发挥作
  • 使用 jquery 远程图像属性

    目前我正在尝试获取远程图像宽度 高度 我正在开发一个链接共享模块 就像当你在 Facebook 上粘贴链接时 你可以看到标题 描述和图像 所以我尝试使用 php getimagesize 来获取图像宽度 高度 但速度非常慢 所以我正在考虑使
  • ReferenceError:regeneratorRuntime未定义(但在范围内工作)

    我遇到过这种奇怪的情况 ReferenceError regeneratorRuntime is not defined 我已经设法在一个非常小的设置中重现 与同一问题上的类似问题相比 并且还注意到一些奇怪的行为 具体取决于是否使用范围 以
  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • Eslint errorring 导入没有扩展名的 jsx

    我正在尝试在 es6 中导入 jsx 文件而不需要 jsx 扩展名 import LoginErrorDialog from LoginErrorDialogView Not import LoginErrorDialog from Log
  • 以编程方式填写reactjs表单

    我正在编写一个用户脚本 但无法填写由reactjs制作的表单 我的代码 document querySelector id username value email protected cdn cgi l email protection
  • IE从哪个版本开始支持Object.create(null)?

    您可以通过多种方式在 JavaScript 中创建对象 creates an object which makes the Object prototype of data var data1 new Object Object liter
  • 摩卡 - Chai Karma“套件未定义”

    我对 jscript tdd 很陌生 遇到了问题 希望有人能告诉我我在做什么 在浏览器中运行测试 通过 HTML 文件 一切正常 通过节点和业力运行它们我得到以下异常 我想在 node js 主机的 karma 中使用 Mocha 和 Ch
  • 图像无法在带有 DOM 的 IE 中加载:控制台中的 7009 错误(无法解码)

    当在 IE 中的单个页面上加载许多图像时 在 IE11 中重现 其中一些图像开始加载失败 并在控制台中出现类似以下警告的内容 DOM7009 无法解码 URL 处的图像 某些唯一的 url 当我查看网络流量时 似乎确实从服务器收到了每个图像
  • 可以在初始 DOM 解析期间/之前修改 DOM 吗?

    是否可以在初始 DOM 解析期间或之前修改 DOM 或者我是否必须等到 DOM 被解析和构建之后才能与其交互 更具体地说 是否有可能阻止 DOM 中的脚本元素使用用户脚本 内容脚本或 Chrome 或 Firefox 中的类似脚本运行 在解
  • 设置 cookie 时中断 JavaScript 执行

    当设置 cookie 时 是否可以始终中断浏览器开发人员工具中的 javascript 执行 无需显式设置 JS 断点 document cookie 在 html head 块的开头添加此代码片段效果很好
  • 调整图像大小并将画布旋转 90 度

    这里有很多关于在 js 上使用画布旋转图像的主题 我阅读了其中的大部分内容 但无法找到解决我的问题的方法 我正在接收任何分辨率的图像 来自上传组件 我将其大小调整为 1024x768 如下所示 var canvas document cre
  • 使用 CSS 或 Javascript 填充动画

    我只是想知道是否可以使用 CSS 或 javascript 创建填充动画 基本上我想创建一个填充动画 如下图所示 http i40 tinypic com eit6ia png http i40 tinypic com eit6ia png
  • Firebase 函数 onWrite 未被调用

    我正在尝试使用 Firebase 函数实现一个触发器 该触发器会复制数据库中的一些数据 我想观看所有添加的内容votes user vote 结构为 我尝试的代码是 const functions require firebase func
  • 正则表达式 - 从 markdown 字符串中提取所有标题

    我在用灰质 https www npmjs com package gray matter 以便将文件系统中的 MD 文件解析为字符串 解析器产生的结果是这样的字符串 n Clean er ReactJS Code Conditional
  • 日期出现奇怪的错误,“未捕获非法访问”

    所以我试图找到最新的DateJavascript 可以处理 我把它减少到 9 月 275760 并增加了我开始捕获未捕获的天数illegal access例外new Date 09 24 275760 to new Date 10 13 2
  • 使用 Vue 的多模式组件

    我在 Vue 中实现动态模式组件时遇到问题 A common approach I follow to display a set of data fetched from the db is I dump each of the rows
  • Vue 和 Vuex:处理依赖的计算属性

    我的应用程序是一个使用 Vuex 在 Vue 中构建的精简电子表格 关键组件是TableCollection Table and Row The TableCollection有一个包含多个的数组Table对象 每个Table有一个包含多个
  • JavaScript 相对路径

    在第一个 html 文件中 我使用了一个变量类别链接 var categoryLinks Career prospects http localhost Landa DirectManagers 511 HelenaChechik Dim0
  • Jquery - 选择选项后如何获取选项的特定数据类型?

    我将直接跳到标记 然后解释我想要做什么 HTML 选择选项

随机推荐

  • PHP 中的插件架构

    我正计划研究如何在 PHP 中实现插件架构 我曾尝试在网上搜索可能的参考资料 但我认为如果我在这里提问 也许我对好的参考资料的搜索会更快 更相关 这里有人尝试过在网络项目中使用插件架构吗 谢谢 欧文 我已经编写了 WordPress 插件
  • 如何从 Swift 中的 UserDefaults 中按套件名称删除所有数据?

    我创建了用户默认值 名称如下 let prefs1 UserDefaults init suiteName UserAccount let prefs2 UserDefaults init suiteName UserInfo 然后我为这些
  • SQLSyntaxErrorException:表/视图“买家”不存在。缺什么?

    几周前 我去度假并暂停了我的一个项目 当我回来时 我只是检查注册页面 当我收到一个 SQLException 说表不存在时 我感到很惊讶 我不明白它 因为该表存在 我从一个实体创建它 我将代码粘贴到此处 以便您可以看到一切似乎都正常 我认为
  • 跨进程的数据库连接池

    我们有一个由多个 EXE 组成的客户端 服务器应用程序 数据访问层与我们的 EXE 模块共享的库中的客户端位于同一物理层 ODBC 和 OleDB 连接池按进程进行管理 是否有跨进程共享数据库连接的技术 除了将数据访问层移至中间层之外 OL
  • run_inference_for_single_image(image, graph) - Tensorflow,对象检测

    在参照对象检测教程 ipynb 我想知道是否可以运行目录中的所有图像 而不是编写 for 循环并运行 run inference for single image image graph 有没有办法对目录中的所有图像运行推理或对多个图像运行
  • “var”变量、“this”变量和“全局”变量 - 在 JavaScript 构造函数中

    在我上一个问题之后 这个问题对我来说更准确 example function Foo this bla 1 var blabla 10 blablabla 100 this getblabla function return blabla
  • 处理应用程序退出

    当用户使用以下命令退出应用程序时 我想运行一些清理代码 例如取消注册计划通知 Alt F4或向下滑动手势 WinJS 有没有办法处理应用程序退出 我已经阅读了文档WinJS 应用程序对象 但没有看到任何处理用户退出的方法 没有特别活动表明应
  • Python3:os.system不重定向标准输出

    正如标题中提到的 我的代码中有这个 os system vpr vpr config file name seed str seed gt str bench name str seed stdout 其中有很多变量 但它的计算结果只是这个
  • 反应选择不识别默认值

    我有一个反应选择组件无法识别默认值选项 代码如下所示 renderPlans if this props plans let list this props plans map item gt return label item descr
  • 时间:2019-03-07 标签:c#progressbarpercent

    我在 winform c 应用程序中有一个进度条 我将其作为进度指示器 进度条可以有不同的最大尺寸 具体取决于用户输入的数量 可以超过 100 所以这就是我的设置方式 this pbLoadingWrite Maximum Input Le
  • 一项活动和所有其他片段[关闭]

    Closed 这个问题是基于意见的 目前不接受答案 我正在考虑实现一个屏幕Activity以及所有其他屏幕Fragments and managing all the fragments thru the activity 这是不是一个好主
  • 递归累积和

    我需要编写一个程序 使用 def 但仅使用递归来计算数字列表的累积和 我做到了 但现在我需要编写相同的程序而不使用该方法sum 但到目前为止还没有成功 任何想法 my code def rec cumsum numbers Input nu
  • 如何迭代 Numpy 数组的初始维度?

    我有一个具有形状的 Numpy 数组 1000 1000 1000 3 是最后一个维度 大小为 3 包含 3D 空间向量分量的三元组 我该如何使用nditer迭代每个三元组 像这样 for vec in np nditer my array
  • 为所有文本框控件提供相同的属性

    如何为同一表单中存在的所有文本框赋予相同的属性 foreach var textbox in this Controls OfType
  • Apache 整个目录的重写规则

    我想设置重写规则 RewriteRule test my long path index html 但我的index html 通过ajax 获取其他文件 所以它的工作方式并不像这样简单 我需要目录的所有子文件的规则我试过 RewriteR
  • Python 的 Chronic(Ruby NLP 日期/时间解析器)?

    有谁知道像chronic这样的库 但针对python Thanks 你有没有尝试过解析日期时间
  • Spring security SAML 可用于在运行时配置 IDP

    我想实施SSO using SAML 2 0在我的网络应用程序中 我见过spring security saml和例子春季启动应用程序 在查看示例后 我想知道以下几件事 是否可以在运行时获取 Idp Url 和证书并使用 spring sa
  • WiX 安装后我的 exe 文件无法通过双击运行,只能以管理员身份运行

    当我安装这个 MSI 包时 我使用 WiX 准备了一个 MSI 安装项目 ProgramFiles 并创建桌面文件夹的快捷方式 它只能以管理员身份运行 双击时不起作用 当我在桌面上安装文件夹时 双击即可使用 我想安装到 ProgramFil
  • datetimepicker 类 - 具有 dts_appcanparse 样式 - 无法选择

    当用户完成编辑时 我得到 DTN USERSTRING 引出了一个问题 用户何时完成编辑 输入日期后 TAB 似乎没有生成此通知 我也没有得到 dtn keydown 或任何其他信息 鼠标或按 ALT 似乎可以解决问题 但我需要让 TAB
  • 带饼干的倒计时器

    我知道有很多这样的话题 但我只是遇到问题 找不到答案 我的脚本是 window onload function 200 seconds countdown var countdown 14400 current timestamp var