微信小程序日期增加时间完成订单失效倒计时效果

 更新时间:2024年04月26日 10:23:27   作者:换日线°  
这篇文章主要介绍了微信小程序日期增加时间完成订单失效倒计时效果,在我们日常购物过程中经常会遇到这样的功能,本文通过示例代码给大家详细讲解,需要的朋友参考下吧

效果图

请添加图片描述

.wxml

<view class="TimeSeond">{{second}}</view>

.js

Page({
  data: {
    tiem_one:'',
    second:'',//倒计时
    deadline:'',
  },
  onLoad(){
    this.countdown();
  },
  countdown(){
    let timestamp = Date.parse(new Date()) / 1000;//当前时间戳
    let time = this.addtime('2024-4-19 17:20:00');//当前时间转时间戳
    if(time > timestamp){
      this.deadline = (time - timestamp) * 1000
      this.setData({
        deadline:this.deadline
      })
      this.single()
    }else{
      that.setData({
        second:'00:00'
      })
    }
  },
  addtime(time){
    let date = new Date(time);
    let minutes = date.getMinutes();
    date.setMinutes(minutes+30);//增加三十分钟
    return Date.parse(date) / 1000;
  },
  single(e){
    var that = this
    var time = that.deadline,minutes,seconds;
    that.tiem_one = setInterval(function() {
      time = time - 1000
      minutes = parseInt((time % (1000 * 60 * 60)) / (1000 * 60));
      seconds = parseInt((time % (1000 * 60)) / 1000);
      if (time < 1) {
        that.setData({
          second:'00:00'
        })
        clearInterval(that.tiem_one)
        return false
      }
      minutes = minutes > 9 ? minutes : '0' + minutes
      seconds = seconds > 9 ? seconds : '0' + seconds
      that.setData({
        second:minutes + ':' + seconds
      })
    },1000)
  },
})

到此这篇关于微信小程序日期增加时间完成订单失效倒计时的文章就介绍到这了,更多相关小程序订单失效倒计时内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 使用typescript快速开发一个cli的实现示例

    使用typescript快速开发一个cli的实现示例

    这篇文章主要介绍了使用typescript快速开发一个cli的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-12-12
  • uniapp中table表格设置宽度无效的原因以及解决方法

    uniapp中table表格设置宽度无效的原因以及解决方法

    项目中遇到table表格单元格不整齐、错位等情况,下面这篇文章主要给大家介绍了关于uniapp中table表格设置宽度无效的原因以及解决方法,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-04-04
  • javascript实现禁止鼠标滚轮事件

    javascript实现禁止鼠标滚轮事件

    这篇文章主要介绍了javascript实现禁止鼠标滚轮事件的相关资料,需要的朋友可以参考下
    2015-07-07
  • echarts 3D地图为区域自定义颜色的解决方法

    echarts 3D地图为区域自定义颜色的解决方法

    在Echarts中,我们很多时候是需要给自己想要的几个区域的地图进行颜色高亮,这篇文章主要给大家介绍了关于echarts 3D地图为区域自定义颜色的相关资料,需要的朋友可以参考下
    2021-08-08
  • JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】

    JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】

    这篇文章主要介绍了JavaScript版经典游戏之扫雷游戏实现方法,结合完整实例形式分析了扫雷游戏的原理与具体实现流程,并附带demo源码供读者下载参考,需要的朋友可以参考下
    2016-12-12
  • 跟我学习javascript创建对象(类)的8种方法

    跟我学习javascript创建对象(类)的8种方法

    跟我学习javascript创建对象(类)的8种方法,每一种方法都有详细的介绍,不知道javascript如何创建对象的朋友,不要错过这篇文章。
    2015-11-11
  • php+js实现倒计时功能

    php+js实现倒计时功能

    由PHP传入JS处理的时间戳我说怎么老是对不上号呢,原来JS时间戳为13位,包含3位毫秒的,而PHP只有10位不包含毫秒的。恩,基础还是要补补的
    2014-06-06
  • 详解JavaScript的数据类型以及数据类型的转换

    详解JavaScript的数据类型以及数据类型的转换

    这篇文章主要介绍了JavaScript的数据类型以及数据类型的转换,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • javascript获得服务器端控件的ID的实现代码

    javascript获得服务器端控件的ID的实现代码

    javascript获得服务器端控件的ID的实现代码,需要的朋友可以参考下。
    2011-12-12
  • JS本地刷新返回上一页代码

    JS本地刷新返回上一页代码

    返回上一页并刷新在此功能有利于用户的体验,是每一个web开发人员所必备的一项,这篇文章主要介绍了JS本地刷新返回上一页代码,感兴趣的小伙伴们可以参考一下
    2016-07-07

最新评论