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

【问题标题】：disabled button after timer expired [duplicate]计时器到期后禁用按钮[重复]
【发布时间】：2020-06-21 23:39:17
【问题描述】：

我使用的是 <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 %}

【问题讨论】：

这能回答你的问题吗？ Disabling and enabling a html input button
@SudarshanRai 不，我使用的是
@Mary 不，disabled 属性的作用相同
为什么按钮里面有链接？点击按钮调用javascript怎么样？

标签： jquery html

【解决方案1】：

试试这个

<a  href="{% url 'add' %}?parent_ID={{ me.id }}" style="color:white;"  rel="nofollow" ><input type="button" id="invite" value="Invite Now!" class="main-btn main-btn-2"></a>
{% for n in ako %}
<script>
var countDownDate = new Date("{{n.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;
  }
}, 1000);
</script>
{% endfor %}

【讨论】：

我想我需要先阅读 html 标签 :) 谢谢。它有效！