msab
msab

Reputation: 27

how to Make a button disabled for 10 minutes even after refresh?

I want to disable button for 10 minutes after clicking on it and even on refresh it will remain disabled. How can i make it in javascript or jquery ? I just cant seem to make it for my code.

  <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js">
       $(document).ready(function(){
   var limit = 10*60*1000; 
                   btn.attr("disabled", true);
                btn.css('cursor','not-allowed');
                message.text('wrong answer, please wait 10 minutes before trying again');
   var timer = setTimeout(disableMyButton, limit);

   function disableMyButton(){
              btn.removeAttr("disabled");
                    message.text('');
      localStorage.setItem("isMyButtonDisabled", "true");
   }

   if(localStorage.getItem("isMyButtonDisabled") == "true"){
               message.text('');
               btn.removeAttr("disabled");

     window.clearTimeout(timer);
   }
});
 </script>

Upvotes: 1

Views: 1517

Answers (1)

dev4life
dev4life

Reputation: 892

You have the right idea. Use the localStorage but put the timestamp in there. Then when the page is loaded, grab the timestamp from localStorage. If the difference between the localStorage timestamp and now is over 10 minutes, then enable the button. If not, set the timeout appropiately. The only problem is keeping the localStorage clean. Make sure you wipe out the timestamp at the end of the 10 minutes.

Upvotes: 2

Related Questions