setTimeout無法正常工作

Question

我有一個腳本，在點擊按鈕後禁用按鈕，等待5秒鐘，然後再次啓用它。

$(document).on('click', 'button', function() { 
    var htmls = $(this).html(); 
    $(this).prop("disabled", true); 
    setTimeout(function() { 
     $(this).prop("disabled", false); 
     $(this).html(htmls); 
    }, 5000); 
    $(this).html('<img src="<?=CDN('/icons/loading/loading5.gif ')?>" />'); 
}); 

不知何故setTimeout將不會結束，所以該按鈕將不會再次啓用。我沒有收到任何錯誤消息。

Answer 1

保存$(this)到變量之前setTimeout通話，因爲裏面setTimeout處理this關鍵字是指window對象：

$(document).on("click", "button", function() { 
    var $this = $(this), 
     htmls = $this.html(); 

    $this.prop("disabled", true) 
     .html('<img src="..." />'); 

    setTimeout(function() { 
     $this.prop("disabled", false) 
      .html(htmls); 
    }, 5000); 
}); 

Answer 2

這裏不指DOM element.Try投入另一個temarory variable.Because它setTimeOut

var $this = $(this), 
     htmls = $this.html(); 

    $this.prop("disabled", true); 
    setTimeout(function() { 
     $this.prop("disabled", false).html(htmls); 
    }, 5000);