【问题标题】:countdown timer didn't show up倒数计时器没有出现
【发布时间】:2022-01-10 06:12:01
【问题描述】:

刷新倒计时后没有出现并且它被禁用

当我刷新页面时,我的倒计时计时器可以正常工作,但是当我只刷新特定的 div 时,我的倒计时不会显示并且按钮会被禁用。

注意:我使用disabled 标签禁用了我的按钮

function refreshDiv() {
  $('#container3').load(window.location.href + " #container3 >");
}

JavaScript

var spn = document.getElementById("count");
var btn = document.getElementById("btnCounter");

var count = 2; // Set count
var timer = null; // For referencing the timer

(function countDown() {
  // Display counter and start counting down
  spn.textContent = count;

  // Run the function again every second if the count is not zero
  if (count !== 0) {
    timer = setTimeout(countDown, 1000);
    count--; // decrease the timer
  } else {
    // Enable the button
    btn.removeAttribute("disabled");
  }
}());

这是我的 html 代码,当我刷新整个页面时它可以正常工作,但是当我刷新 #container3 时,我的按钮被禁用并且没有显示倒计时

  <div class="container2" id="container3">
    <h4 id="title">here</h4>
    <div class="controls">
        <div class="main-controls">
            <div class="dropdown">
                <button
                    class="btn btn-primary dropdown-toggle" 
                    data-bs-toggle="dropdown"  id="btnCounter" disabled
                >
                    File <span id="count"></span>
                </button>
                <div class="dropdown-menu">
                    
                    <button id="txt-btn" class="dropdown-item" 
            onclick="refreshDiv();">
                        Save here
                    </button>

【问题讨论】:

  • 创建一个关于它的sn-p
  • @Aman Sharma 兄弟,我是新来的,我不知道该怎么做
  • 请使用 jsfiddle 或 codepen 重现错误/问题。只需用谷歌搜索其中任何一个。
  • “文件”和“保存”按钮应该做什么?

标签: javascript html jquery ajax


【解决方案1】:

我认为这是解决方案,但我不确定我是否正确理解您要执行的操作:

var spn = document.getElementById("count");
var btn = document.getElementById("btnCounter");

var count = 2; // Set count
var timer = null; // For referencing the timer

(function countDown() {
  // Display counter and start counting down
  spn.textContent = count;

  // Run the function again every second if the count is not zero
  if (count !== 0) {
    timer = setTimeout(countDown, 1000);
    count--; // decrease the timer
  } else {
    // Enable the button
    btn.removeAttribute("disabled");
  }
}());

function refreshDiv() {
  location.reload();
}
this is my html code its work properly when I refresh the whole page but when I refresh #container3 my button got disabled and countdown didn't showed

<div class="container2" id="container3">
  <h4 id="title">Title</h4>
  <div class="controls">
    <div class="main-controls">
      <div class="dropdown">
        <button class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" id="btnCounter" disabled>
          File <span id="count"></span>
        </button>
        <div class="dropdown-menu">
          <button id="txt-btn" class="dropdown-item" onclick="refreshDiv();">Save</button>
        </div>
      </div>
    </div>
  </div>
</div>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-07-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多