I use the following link codes, it works well, but I want the button to be clicked only once when the time is zero?

Enabling Button after certain time frame in Jquery html?

I changed the code as follows but it did not work?

function enableButton() {
  var timer2 = "00:05";

  var interval = setInterval(function() {
    var timer = timer2.split(':');
    //by parsing integer, I avoid all extra string processing
    var minutes = parseInt(timer[0], 10);
    var seconds = parseInt(timer[1], 10);
    --seconds;
    minutes = (seconds < 0) ? --minutes : minutes;
    if (minutes < 0) clearInterval(interval);
    seconds = (seconds < 0) ? 59 : seconds;
    //minutes = (minutes < 10) ?  minutes : minutes;
    $('.countdown').html(minutes   ':'   seconds);
    timer2 = minutes   ':'   seconds;
    if (minutes == 0 && seconds == 0) {
      clearInterval(interval);

      document.getElementById('Send_Active').addEventListener('click', function() {
        enableButton();
        alert('ok');
      });
    } else {
      //document.getElementById('Send_Active').setAttribute('hidden', true);                
    }

  }, 1000);
}
enableButton();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <div id="countdown" class="countdown"></div>
</div>
<div class="form-group">
  <a id="Send_Active">send again</a>
</div>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

You can use removeEventListener() to remove the listener you added.

const btnSendActive = document.getElementById('Send_Active');

function buttonClicked() {
  btnSendActive.removeEventListener('click', buttonClicked);
  enableButton();
  alert('ok');
}

function enableButton() {

  var timer2 = "00:03";

  var interval = setInterval(function() {
    var timer = timer2.split(':');
    var minutes = parseInt(timer[0], 10);
    var seconds = parseInt(timer[1], 10);

    --seconds;
    minutes = (seconds < 0) ? --minutes : minutes;
    if (minutes < 0) clearInterval(interval);
    seconds = (seconds < 0) ? 59 : seconds;

    $('.countdown').html(minutes   ':'   seconds);
    timer2 = minutes   ':'   seconds;
    if (minutes == 0 && seconds == 0) {
      clearInterval(interval);
      btnSendActive.addEventListener('click', buttonClicked);
    }
  }, 1000);

}

enableButton();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
  <div id="countdown" class="countdown"></div>
</div>
<div class="form-group">
  <a id="Send_Active">send again</a>
</div>

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>