Javascript 在开始-停止按钮jquery之间切换

嘿，我正在尝试创建一个“开始-停止”按钮，在一个按钮中彼此切换…我让它与“停止”一起工作，但似乎无法让它在那之后返回到“开始”

这是我正在做的小提琴

这是js

 $('#start_timer_button').on('click', function(e){
     e.preventDefault();
     $('.stop_button').removeClass('stop_button');
     $(this).text('stop').addClass('stop_button');
 });

这是html

 <button id='start_timer_button'> Start Timer</button>

启动计时器

试试这个：

$('#start_timer_button').on('click', function (e) {
    e.preventDefault();
    $(this).text(function (_, text) {
        return text === 'stop' ? 'Start Timer' : 'stop';
    }).toggleClass('stop_button');
});

试试这个：

$('#start_timer_button').on('click', function (e) {
    e.preventDefault();
    $(this).text(function (_, text) {
        return text === 'stop' ? 'Start Timer' : 'stop';
    }).toggleClass('stop_button');
});

---

尝试设置一个if语句来检查它是否应该启动或停止

if ($(this).hasClass('stop_button')) {

---

下面是它的JSFIDLE:

尝试设置一个if语句来检查它是否应该启动或停止

if ($(this).hasClass('stop_button')) {

---

这是它的JSFIDLE：

很好，谢谢，我甚至没有想过将文本用于条件，这很好……很好，谢谢，我甚至没有想过将文本用于条件，这很好……为什么不切换两个完全不同的HTML元素的可见性呢？可以与span位于同一个按钮内，也可以是完全不同的按钮元素。为什么不切换两个完全不同的HTML元素的可见性？可以位于与跨度相同的按钮内，也可以是完全不同的按钮元素。