淡出選項

Question

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="../js/jquery.countdown360.min.js" type="text/javascript" charset="utf-8"></script> 
<script type="text/javascript" charset="utf-8"> 
$(function(){ 
    var $btn = $('#activate'); 
    $btn.click(function(){ 
     var $this = $(this); 
     $this.attr('disabled', 'disabled').html("Activated");   
     $("#countdown").countdown360({ 
      radius  : 40, 
      seconds  : 10, 
      fontColor : '#FFFFFF', 
      autostart : false, 
      onComplete : function() { console.log('done');} 
     }).start(); 
     setTimeout(function() { 
      $this.removeAttr('disabled').html('Activate'); 
     }, 10000); 

    }); 
}); 

我已經把定時器，可以通過點擊一個按鈕來激活。所以我想從計時器淡出當動作完成（10秒後）....感謝您添加解決方案。接下來的問題是：如何定義取消按鈕，當我點擊它，我想：

• 激活按鈕再次啓用
• 停止倒計時

Answer 1

使用回調onComplete淡出計數器：

onComplete : function() { $("#countdown").fadeOut(); } 

參見下面代碼片段例如（改爲3秒鐘，因爲......我討厭等待）。

$(function(){ 
 
var $btn = $('#activate'); 
 
$btn.click(function(){ 
 
    var $this = $(this); 
 
     $this.attr('disabled', 'disabled').html("Activated");   
 
    $("#countdown").countdown360({ 
 
     radius  : 40, 
 
     seconds  : 3, 
 
     fontColor : '#FFFFFF', 
 
     autostart : false, 
 
     onComplete : function() { $("#countdown").fadeOut();} 
 
    }).start(); 
 
    setTimeout(function() { 
 
      $this.removeAttr('disabled').html('Activate'); 
 
     }, 3000); 
 
       
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://www.jqueryscript.net/demo/Simple-jQuery-Html5-Based-360-Degree-Countdown-Timer-countdown360/src/jquery.countdown360.js" type="text/javascript" charset="utf-8"></script> 
 
<button id="activate">Test</button> <div id="countdown"></div>

Answer 2

這裏工作的腳本。用這個替換你的功能。試試吧，讓我知道它是否適合你：

$(function(){ 
     var $btn = $('#activate'); 
     $btn.click(function(){ 
      var $this = $(this); 
       $this.attr('disabled', 'disabled').html("Activated");   
      $("#countdown").countdown360({ 
       radius  : 40, 
       seconds  : 10, 
       fontColor : '#FFFFFF', 
       autostart : false, 
       onComplete : function() { $('#countdown').fadeOut(); } 
      }).start(function(){ 
       setTimeout(function() { 
       $this.removeAttr('disabled').html('Activate'); 
      }, 10000); 
      }); 

     }); 
    }); 

Answer 3

使用的onComplete屬性

的onComplete：disapier（）

功能dissapiar（）{

$ btn.fadeOut（）; }