JS-Methode zur Implementierung des Countdown-Effekts basierend auf Rekursion

Das Beispiel in diesem Artikel beschreibt, wie JS den Countdown-Effekt basierend auf Rekursion implementiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Ereignis:

//发送验证码
$('.js-sms-code').click(function(){
    $(this).attr("disabled", "disabled").html("<span style=&#39;color:#666&#39;><span id=&#39;countdown&#39;>60</span>s 后再试</span>");
    countdown();
    var tel = $(&#39;#tel&#39;).val();
    $.ajax({
      url: "{sh::U(&#39;Home/sendSmscode&#39;)}",
      type:&#39;POST&#39;,
      dataType:"json",
      data: {tel: tel},
      success: function() {
      },
      error: function() {
        $(&#39;.js-help-info&#39;).html("请求失败");
      }
    });
})

Kommentar: Die Countdown-Methode ist hier das Schöne.

Sehen Sie sich den Code an:

function countdown() { // 递归
  setTimeout(function() {
    var time = $("#countdown").text();
    if (time == 1) {
      $('.js-sms-code').removeAttr("disabled");
      $('.js-sms-code').html("发送验证码");
    } else {
      $("#countdown").text(time - 1);
      countdown();
    }
  }, 1000);
}

Kommentar: Wenn die Zeit nicht gleich 1 ist, rufen Sie weiter an und subtrahieren Sie eine Sekunde davon die Zeit. setTimeout ist ebenfalls sehr wichtig. Bis die Zeit auf 1 sinkt, entfernen Sie die Option „Deaktiviert“ und ändern Sie den Inhalt in „Bestätigungscode senden“.