jQuery实现发送验证码倒计时60秒

前端HMTL：

<div class="form_box">
  <div class="line mb40">
    <div class="item">手机验证码：</div>
    <div class="cont">
        <!--点击发送验证码后，倒计时class="count" style="block" -->
        <p class="code">
        <input type="text" value="" class="input_text">
            <span class="info">
               <em style="display: none" class="count">（60）秒后重新发送</em>
               <a href="javascript:;" class="send" onclick="sendValidCode();">发送验证码</a>
            </span>
        </p>
    </div>
  </div>
  <!--消息提示区域 -->
  <div style="visibility: hidden; margin-left: 192px; height: 30px;" id="errorNotice">
  </div>
  <!--设置页面-->
  <div class="line">
    <div class="item"></div>
    <div class="cont">
      <input type="button" onclick="checkValidCode();" value="确 定" class="button01">
    </div>
  </div>
</div>

jQuery实现60秒倒计时：

//发送验证码
function sendValidCode(){
    $('#errorNotice').html('');
    $('.input_text').val('');
    
    $.ajax({
        type: 'post',
        dataType: "json",
        url: "/Ajax/PhoneAuthen.php",
        data: {
            ajaxMethod: "sendValidCodeNew",
            mtype: "2"
        },
        success: function(data){
            if (data.result > 0) {
            
            }
            else {
                $('#errorNotice').html('短信发送失败，请稍后重试！');
                $('#errorNotice').css('visibility', 'visible');
            }
        },
        error: function(data){
            $('#errorNotice').html('短信发送失败，请稍后重试！');
            $('#errorNotice').css('visibility', 'visible');
        }
    });
    
    
    //60秒后重新发送
    var btnSend = $(".send");
    var msg = $('.count');
    btnSend.removeAttr('style').attr('style', 'display:none;');
    msg.removeAttr('style').attr('style', 'display:block');
    var left_time = 60;
    var tt = window.setInterval(function(){
        left_time = left_time - 1;
        if (left_time <= 0) {
            window.clearInterval(tt);
            msg.html('（60）秒后重新发送');
            msg.removeAttr('style').attr('style', 'display:none;');
            btnSend.removeAttr('style').attr('style', 'display:block');
        }
        else {
            msg.html('（' + left_time + '）秒后重新发送');
        }
    }, 1000);
}

 

备注：

visibility:hidden/visible 设置为隐藏/显示(始终占位)

display:不占位