后端获得时间让他以倒计时的方式显示在页面上?

我从后端获得了时间毫秒,让他显示在以倒计时分秒的方式显示在页面上,
但是页面上显示的是一个固定的值,每次刷新之后才会显示最新的值,就是是倒计时的效果,
怎么让前台页面也能动态的倒计时
是用ajax+计时器,每一秒发送一个请求实现么?
还是有更好的优化办法?图片描述

阅读 8.3k
7 个回答

用ajax从后台取一个时间,然后用setInterval不断更新时间,直到剩余时间为0,再clearInterval

setInterval(function(){dom=dom--},1000)

这样就可以了呗。ajax不太靠谱因为,你不确定你的ajax是不是能每秒返回一次。

倒计时一般是前端写,后端返回一个固定时间,不然难道每秒要前后端交互,不说网络延迟,开销就不小。

var itvl = setInterval(function () {
    // 这里你要做的事情
    // 别忘了清计时器
    if(时间到了) {
        clearInterval(itvl);
    }
}, 1000);

给个思路:
后端提供一个时间,前端ajax获取,然后根据获取到的时间数据js再new一个时间,这样页面时间就和后端一致了。然后再通过setInterval来更新页面上的显示。

前面说的够多了
补充几点吧
1.记得倒计时结束后把计时器关掉,setTimeout对应clearTimeout,setInterval对应clearInterval
2.如果是重要信息记得和后台核对一次时间,事件列表循环这种机制很容易产生时间不准确(其实从异步发起请求开始九意味着时间不可能一样了,对钟问题果然哪里都存在)

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题