Javascript 显示查询间隔中的倒计时

我有一个以下查询，每20秒就会触发一次服务器心跳

var uiBlocked = false;
window.setInterval(function() {
 $.ajax({
   cache: false,
   type: 'HEAD',
   url: '/heartbeat/',
   timeout: 1000,
   async: true,
   success: function(data, textStatus, XMLHttpRequest) {
    if (uiBlocked == true && navigator.onLine) {
       uiBlocked = false;
       $.unblockUI();
      }
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
     if(textStatus != 'timeout'){
        if (uiBlocked == false){
          uiBlocked = true;
          $.blockUI({
            message: "Lost connectivity, please reconnect your machine. ",
            css: {
             border: 'none',
             padding: '15px',
             backgroundColor: '#000',
             '-webkit-border-radius': '10px',
             '- moz-border-radius': '10px',
             opacity: .5,
             color: '#fff'
           } });
      }
    }
  }
  })
 }, 20000);

现在，当服务器不可用时，我显示消息

连接中断，请重新连接计算机

作为该信息的一部分，我还想展示：

在30秒内重试，然后20秒递减到19秒、18秒，依此类推

在jQuery中有什么方法可以获得间隔时间的钩子吗？

下面是一个示例，展示了答案

HTML

---

下面是一个简单的javascript计时器，您的javascript片段的可能副本似乎与问题的实质无关。

 <span id="counter"></span>

$(function() {
    var counter = 30;
    function counterFunc() {    
       $("#counter").text(counter);
       counter--;
       if (counter > 0) {
          setTimeout(counterFunc, 1000);
       } else {
          $("#counter").text("Done!");
       }          
   }
   counterFunc();
});