JQuery 버튼 수행시간동안 disabled

개요

jQuery 버튼 수행시간동안 disabled

<style>
  button {
    width: 300px;
    height: 50px;
  }
  
  button:disabled {
    background: #fee;
    border: 0
  }

</style>

<button id='my-btn'>수행</button>

<script src="//code.jquery.com/jquery.min.js"></script>
<script>
  function process(num) {
    $('#my-progress').attr('max', num);
    for (var i = 1; i <= num; i++) {
      console.log('processing ' + i);
      // sleep 1 sec
      ts1 = new Date().getTime() + 100;
      do ts2 = new Date().getTime(); while (ts2 < ts1);
    }
  }

  function async_job() {
    process(30);
    $('#my-btn').prop('disabled', false);
  }

  $(function() {
    $('#my-btn').click(function() {
      $('#my-btn').prop('disabled', true);
      setTimeout(async_job, 0);
    });
  });

</script>