javascript - JS-在setInterval中暂停播放

Question

我正在寻找一种简单的方法来在 setInterval 函数中制作开始停止按钮。但是当停止起作用时，开始就不起作用......

var zman = 3000;
function pls() {
    setTimeout(setInterval, zman);
}

var myVar = setInterval(function() {
            var sz;
            sz = Math.floor((Math.random() * 750) + 1);
            document.getElementById("fsize1").style.fontSize = sz+"%";
            console.log(sz);
            }, zman);

和

<button onclick="pls()">play</button>
<button onclick="clearInterval(myVar)">Stop</button>

怎么了？当我也希望该函数在第一次加载时运行时，我可以由谁来制作播放按钮？

Answer 1

在 pls() 中，您要求在 3 秒后调用 setInterval()。调用不带参数的 setInterval() 不会执行任何操作(尽管您的 JS 控制台中应该会出现错误)。

您想要定义一次函数，然后在单击时和首次运行时调用它:

var zman = 3000,
  myVar = null;

function pls() {
  if (! myVar)
    myVar = setInterval(sizer, zman);
}

function sizer() {
  var sz = Math.floor((Math.random() * 750) + 1);
  document.getElementById("fsize1").style.fontSize = sz + "%";
  console.log(sz);
}

myVar = setInterval(sizer, zman);

<button onclick="pls()">play</button>
<button onclick="clearInterval(myVar); myVar = null;">Stop</button>

<div id="fsize1">test<div>