按钮倒计时，切换active的时候清空重新倒计时

好的，你的问题是关于按钮倒计时的。具体来说，你希望在按钮被点击后开始倒计时，当倒计时结束时，按钮的状态变为“active”，并且当按钮状态从“active”变回“inactive”时，倒计时应该被清空并重新开始。这个问题可以通过JavaScript来解决。

首先，你需要为按钮添加一个点击事件的监听器。在监听器中，你需要启动一个定时器，每个一定的时间间隔就更新按钮的状态和倒计时时间。当倒计时结束时，你需要将按钮的状态设置为“active”，并且在按钮状态变为“inactive”时，你需要清空倒计时并重新开始倒计时。

以下是一个示例代码，可以帮助你实现这个功能：

// 获取按钮元素
const button = document.querySelector("#myButton");

// 定义倒计时时间（以秒为单位）
const countdownTime = 10;

// 定义定时器变量
let timer;

// 定义计时器函数
function startTimer() {
  let remainingTime = countdownTime;

  // 更新按钮状态和倒计时时间
  function updateTimer() {
    button.innerHTML = remainingTime + "s";
    remainingTime--;

    // 倒计时结束
    if (remainingTime < 0) {
      clearInterval(timer);
      button.classList.remove("inactive");
      button.classList.add("active");
    }
  }

  // 启动定时器
  timer = setInterval(updateTimer, 1000);
}

// 添加按钮点击事件监听器
button.addEventListener("click", function () {
  // 如果按钮当前状态为“inactive”
  if (button.classList.contains("inactive")) {
    button.classList.remove("inactive");
    button.classList.add("active");
    startTimer();
  }
  // 如果按钮当前状态为“active”
  else if (button.classList.contains("active")) {
    button.classList.remove("active");
    button.classList.add("inactive");
    clearInterval(timer);
    button.innerHTML = "Start";
  }
});

在这个示例代码中，我们首先获取了按钮元素，并定义了倒计时时间和定时器变量。然后，我们定义了一个计时器函数startTimer()，它会启动一个定时器，每隔一定的时间间隔就更新按钮的状态和倒计时时间。当倒计时结束时，我们将按钮的状态设置为“active”。

接下来，我们为按钮添加了一个点击事件监听器。当按钮当前状态为“inactive”时，我们将按钮状态设置为“active”，并启动倒计时计时器。当按钮当前状态为“active”时，我们将按钮状态设置为“inactive”，并清空倒计时计时器。

希望这个示例代码能够帮助你解决你的问题！