Después de que la cuenta regresiva del temporizador llegue a 0, aparecerá el botón y cuando el usuario registrado haga clic en el botón, debería desaparecer u ocultarse para ese usuario específico. Incluso en la página, el botón de recarga o actualización no debería aparecer antes de las 2 horas contadas desde el momento del evento de clic.
Cuando el usuario registrado hace clic en el botón de reclamo, debe ocultarse y el temporizador de cuenta regresiva debe contar continuamente con el sistema de bucle.
var clicks = 0; var interval = -1; function showTimer(selector, seconds) { var startTime = Date.now(); function showRemaining() { var delta = Date.now() - startTime; // milliseconds var deltaSeconds = delta / (1000); if (deltaSeconds < seconds) { // display minutes remaining $(selector).text(Math.round(seconds - deltaSeconds)); } else { $(selector).text(0); clearInterval(interval); $("#proceed").show(); // Look at here } } if( interval > -1 ) clearInterval(interval); interval = setInterval(showRemaining, 1000); showRemaining(); } $(function() { showTimer("#countdown", 10); }); //when click button function onClick() { $("#proceed").hide(); alert("Successfully Added Your Points Into Your Wallet"); $("#clicks").text(++clicks); showTimer("#countdown", 10); }; .container { margin: 0 auto; padding: 20px; width: 30%; text-align: center; border-radius: 20px; background: coral; overflow: hidden; } #countdown { font-family: montserrat; font-size: 50px; font-weight: bolder; color: #fff; } #proceed { border: 1px solid #fff; border-radius: 20px; padding: 15px; background: transparent; } #btn { font-family: montserrat; font-size: 20px; font-weight: bolder; color: #fff; text-decoration: none; cursor: pointer; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="container"> <span id="countdown"></span> <br> <br> <button type="button" id="proceed" onclick="onClick()"><a href="#" id="btn" class="btn btn-1">Claim Your Points</a></button><br> </div>