zoukankan      html  css  js  c++  java
  • 秒杀

    在购物平台中,秒杀通过对一些商品经过折扣优惠来吸引一些客户流量。

    秒杀功能的逻辑:

    1 请求量大,请求高并发; 2 用户瞬间活跃量高,要求系统响应快;
    3 秒杀商品少,只有少数用户能够买到。

    4.秒杀频道首页列出秒杀商品(进行中的)点击秒杀商品图片跳转到秒杀商品详细页。
    5.商品详细页显示秒杀商品信息,点击立即抢购实现秒杀下单,下单时扣减库存。当库存为 0 或不在活动期范围内时无法秒杀。
    6.秒杀下单成功,直接跳转到支付页面(支付宝),支付成功,跳转到成功页,填写收货地址、电话、收件人等信息,完成订单。

    7.当用户秒杀下单 5 分钟内未支付,取消预订单,调用支付宝支付的关闭订单接口,恢复库存。

    秒杀功能倒计时的实现:

    1. 前端第一种方法

    var addTimer = function(){
    var list = [],
    interval;

    return function (id, time) {
    if (!interval)
    interval = setInterval(go, 1000);
    list.push({ ele: document.getElementById(id), time: time });
    }

    function go() {
    for (var i = 0; i < list.length; i++) {
    list[i].ele.innerHTML = getTimerString(list[i].time ? list[i].time -= 1 : 0);
    if (!list[i].time)
    list.splice(i--, 1);
    }
    }

    function getTimerString(time) {
    var not0 = !!time,
    d = Math.floor(time / 86400),
    h = Math.floor((time %= 86400) / 3600),
    m = Math.floor((time %= 3600) / 60),
    s = time % 60;
    if (not0)
    return "还有" + d + "天" + h + "小时" + m + "分" + s + "秒";
    else return "立即购买";
    }
    } ();

    addTimer("timer1", 10);

    2.前端第二种方法

    function FreshTime(){
    var endtime=new Date(obj.data[0].fields.begin_time.replace("T",' ').split("Z")[0]);//结束时间
    var nowtime = new Date();//当前时间
    var lefttime=parseInt((endtime.getTime()-nowtime.getTime())/1000);
    d=parseInt(lefttime/3600/24);
    h=parseInt((lefttime/3600)%24);
    m=parseInt((lefttime/60)%60);
    s=parseInt(lefttime%60);

    document.getElementById("LeftTime").innerHTML="还剩" + d+"天"+h+"小时"+m+"分"+s+"秒";
    if(lefttime<=0){
    document.getElementById("LeftTime").innerHTML="秒杀已结束";
    clearInterval(sh);
    $(".operate_btn").show()
    }
    }
    FreshTime();
    var sh;
    sh=setInterval(FreshTime,1000);

  • 相关阅读:
    42. Trapping Rain Water
    223. Rectangle Area
    645. Set Mismatch
    541. Reverse String II
    675. Cut Off Trees for Golf Event
    安装 VsCode 插件安装以及配置
    向上取整 向下取整 四舍五入 产生100以内随机数
    JS 判断是否为数字 数字型特殊值
    移动端初始配置,兼容不同浏览器的渲染内核
    Flex移动布局中单行和双行布局的区别以及使用
  • 原文地址:https://www.cnblogs.com/chengdongzi/p/10698586.html
Copyright © 2011-2022 走看看