如何在每次标签更改时将计数器重置为1？

我有这个代码，它被认为是一个呼吸练习，计数如下:

8 second inhale 
8 second "hold inhale"
12 second "exhale"
8 second "hold exhale"

除了计数器将递增而不重置为1之外，一切都工作正常。它应该是例如1到8，然后又是1到8，然后是1到12，等等。

// Function to start the timer
function startTimer() {
  var timer = document.getElementById('timer');
  var label = document.getElementById('label');
  var count = 1;

  // Interval for the timer
  var interval = setInterval(function() {
    // Update the timer display and label
    timer.textContent = count;

    if (count <= 8) {
      label.textContent = 'Inhale';
    } else if (count <= 16) {
      label.textContent = 'Pause Inhale';
    } else if (count <= 28) {
      label.textContent = 'Exhale';
    } else if (count <= 36) {
      label.textContent = 'Pause Exhale';
    }

    // Increment count
    count++;

    // Stop the timer after reaching 8, 8, 12, 8 pattern
    if (count === 45) {
      clearInterval(interval);
      startTimer();
    }
  }, 1000); // 1000 milliseconds = 1 second
}

// Start the timer initially
startTimer();

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  margin: 0;
  font-family: Arial, sans-serif;
  text-align: center;
}

h1 {
  font-size: 24px;
  font-weight: bold;
}

p {
  font-size: 18px;
}

<h1>Special Timer</h1>
<p id="timer"></p>
<p id="label"></p>

对当前动作的计数和整个周期的长度使用不同的变量。

// Function to start the timer
function startTimer() {
  var timer = document.getElementById('timer');
  var label = document.getElementById('label');
  label.textContent = 'Inhale';
  var count = 1;
  var segcount = 1;

  // Interval for the timer
  var interval = setInterval(function() {
    // Update the timer display and label
    timer.textContent = segcount;

    if (count == 8) {
      label.textContent = 'Pause Inhale';
      segcount = 0;
    } else if (count == 16) {
      label.textContent = 'Exhale';
      segcount = 0;
    } else if (count == 28) {
      label.textContent = 'Pause Exhale';
      segcount = 0;
    }

    // Increment count
    count++;
    segcount++;

    // Stop the timer after reaching 8, 8, 12, 8 pattern
    if (count === 45) {
      clearInterval(interval);
      startTimer();
    }
  }, 1000); // 1000 milliseconds = 1 second
}

// Start the timer initially
startTimer();

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  margin: 0;
  font-family: Arial, sans-serif;
  text-align: center;
}

h1 {
  font-size: 24px;
  font-weight: bold;
}

p {
  font-size: 18px;
}

<h1>Special Timer</h1>
<p id="timer"></p>
<p id="label"></p>

您应该添加另一个变量来保存每个步骤计数器，就像这样。

// Function to start the timer
function startTimer() {
  var timer = document.getElementById('timer');
  var label = document.getElementById('label');
  var count = 0;
  // Variable 'stepCount' to hold each step counter
  var stepCount = 0;

  // Interval for the timer
  var interval = setInterval(function() {
    // Update the timer display and label


    if (count === 0) {
      label.textContent = 'Inhale';
    } else if (count === 8) {
      // reset stepCount to 0
      stepCount = 0;
      label.textContent = 'Pause Inhale';
    } else if (count === 16) {
      // reset stepCount to 0
      stepCount = 0;
      label.textContent = 'Exhale';
    } else if (count === 28) {
      // reset stepCount to 0
      stepCount = 0;
      label.textContent = 'Pause Exhale';
    }
    
    // Increment count
    count++;
    // Increment stepCount
    stepCount++;
    //You show here the counter
    timer.textContent = stepCount;

    // Stop the timer after reaching 8, 8, 12, 8 pattern
    if (count === 36) {
      clearInterval(interval);
      startTimer();
    }
  }, 1000); // 1000 milliseconds = 1 second
}

// Start the timer initially
startTimer();

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  margin: 0;
  font-family: Arial, sans-serif;
  text-align: center;
}

h1 {
  font-size: 24px;
  font-weight: bold;
}

p {
  font-size: 18px;
}

<h1>Special Timer</h1>
<p id="timer"></p>
<p id="label"></p>

您可以使用有限状态机(https://en . Wikipedia . org/wiki/有限状态机):

// Function to start the timer
function startTimer() {

  const timer = document.getElementById('timer');
  const label = document.getElementById('label');
  let count = 1;
  
  const states = Object.entries({
    'Inhale': 8, 
    'Pause Inhale': 8, 
    'Exhale': 12, 
    'Pause Exhale': 8
  }).map(([label, duration]) => ({label, duration}));
  let state = 0;
 
  const syncUI = () => {
    label.textContent = states[state].label;
    timer.textContent = count;
  };
  
  syncUI();
  
   // Interval for the timer
  return interval = setInterval(function() {

    // Increment count
    count++;

    // Update the timer display and label
    timer.textContent = count;

    if (count > states[state].duration) {
      state++;
      if(state === states.length){
        state = 0;
      }
      count = 1;
      syncUI();
    }

  }, 1000); // 1000 milliseconds = 1 second
}

// Start the timer initially
startTimer();

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  margin: 0;
  font-family: Arial, sans-serif;
  text-align: center;
}

h1 {
  font-size: 24px;
  font-weight: bold;
}

p {
  font-size: 18px;
}

<h1>Special Timer</h1>
<p id="timer"></p>
<p id="label"></p>

代码完全按照您告诉它的去做(当然总是这样)，因为您的代码中没有告诉显示的计数要重置。实现这一点的一种方法是使用一个名为displayedCo unt的单独计数，当隐藏计数达到特定数值时，该计数会重置，如下所示:

// Function to start the timer
function startTimer() {
  var timer = document.getElementById('timer');
  var label = document.getElementById('label');
  var count = 1;
  var displayedCount = 1;

  // Interval for the timer
  var interval = setInterval(function() {
    // Update the timer display and label
    timer.textContent = displayedCount;

    if (count <= 8) {
      label.textContent = 'Inhale';
    } else if (count <= 16) {
      label.textContent = 'Pause Inhale';
    } else if (count <= 28) {
      label.textContent = 'Exhale';
    } else if (count <= 36) {
      label.textContent = 'Pause Exhale';
    }

    // Increment count
    count++;
    if (count === 9 || count === 17 || count === 29 || count === 37) {
      displayedCount = 1;
    } else {
      displayedCount++;
    }

    // Stop the timer after reaching 8, 8, 12, 8 pattern
    if (count === 45) {
      clearInterval(interval);
      startTimer();
    }
  }, 1000); // 1000 milliseconds = 1 second
}

// Start the timer initially
startTimer();

不是python写的软件能反编译吗_python

不是python写的软件能反编译吗？可以，编译语言，都可以反编译，比如c语言。

银行中层收入有多少_java

银行中层收入有多少？银行员工的中层收入到底有多少，让我作为员工的家属告诉你一些真实的情况，根据外界公开的银行平均薪酬，大家会以为银行的收入高，其实大多数人是被平均的，能够拿到平均薪酬的可以说至少是银行的中层干部。‬银行中层的收入和公开的平

monthbetween oracle

月份差是Oracle数据库常用的一个函数，它能够用于计算两个日期间隔的月数。例如，假设我们想要计算2018年1月1日与2019年3月1日之间的月份差：SELECT MONTHS_BETWEEN('01-JAN-2018', '01-MAR-2019')

php 入门视频教程，零基础学php有什么推荐的书或者教程吗_PHP基础

php 入门视频教程，如果你想学习php教程，对于零基础学php有什么推荐的书或者教程吗有疑问，分享如下：php 入门视频教程，零基础学php有什么推荐的书或者教程吗？在这里我谈点我自学PHP的经验。相信大部分朋友和我以前一样零基础。如果各位兄弟自学的话，意志力非常重要，我看

ajax参数error使用

AJAX参数error是用于处理请求错误的回调函数。无论是网络出错、服务器出错还是其他错误，都可以通过error函数来捕捉并进行处理。在开发中，合理地使用error参数可以提高用户体验，避免出现未经处理的错误提示，同时也能更好地了解系统的运行情况，及时修复问题。error函数接受

bilibili macos pip

题目: Bilibili MacOS下Pip使用问题的解决方案在MacOS环境下，使用Pip安装Python包时，很多Bilibili用户都遇到了一些问题。希望能够找到一种解决方案，使得Pip在MacOS系统中能够正常使用，并成功安装所需的Python包。首先，我们

php foreach 嵌套

正在研究 PHP 开发，您是否遇到过需要嵌套 foreach 循环的情况呢？在 PHP 中，foreach 循环是很常用的循环方式，而嵌套 foreach 循环则是对于复杂的数据结构来说，非常实用的一种迭代方式。今天我们就来聊聊在 PHP 中使用嵌套 foreach 循环。假设现在有这样一个数组

前端老白-ipadpro 2021能装macos吗

iPad Pro 2021 是搭载了强大的Apple M1芯片的最新一代iPad Pro。它引入了许多令人兴奋的功能和性能提升。然而，有很多人好奇是否可能在iPad Pro 2021上安装macOS系统。在本文中，我们将探讨这个问题，并给出一些解答。首先，针对这个问题的简短结论是

lnuix 卸载php

在Linux操作系统中，卸载一个软件并不是一件麻烦的事情。但是对于不熟悉Linux的使用者来说，可能并不清楚该如何卸载php。因此，下面将给出详细的卸载php的过程，并且会提供一些具体的例子。首先，我们需要查看php是否已经安装在系统中。可以使用以下命令进行检查：php -

俄罗斯乌克兰，战争什么时候结束？

俄乌战争有可能会很快结束，因为现在出现了新情况，最近德法意领导人齐聚基辅，敦促泽连斯基尽快停火，以土地换和平，并提出承诺让乌克兰尽快成为欧盟候选国，虽然还未到冬天，但因为俄罗斯天然气断供，能源价格高企，欧盟快绷不住了，吊诡的是欧洲大陆外的英国首先发难，数万英国人走上街头抗议，估计接下来