计时器到期后禁用按钮[重复]

Question

此问题已经在这里有了答案：

Disabling and enabling a html input button（9个答案）

关闭2个月前。

我使用的是<button>而不是<input type="button">，我认为这有很大的不同吗？

我只希望如果倒计时已过期，<button>也将被禁用，我不知道禁用按钮的逻辑是否正确，但倒计时就像一个超级按钮

我的HTML里面有这个脚本

<button  class="main-btn main-btn-2" id="invite"> <a  href="{% url 'add' %}?parent_ID={{ me.id }}"  rel="nofollow">Invite Now</a></button>

{% for timer in countdown %}
<script>
var countDownDate = new Date("{{timer.enddate}}").getTime();

var x = setInterval(function() {


  var now = new Date()

  var distance = countDownDate - now;

  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  document.getElementById("demo").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";

  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
    document.getElementById("invite").disabled = true; // this is my logic if the timer expired the button will disabled
  }
}, 1000);
</script>
{% endfor %}

Answer 1

尝试一下