javascript用输入值更新一个setInterval

Question

嘿，我只是想知道是否有人可以帮助我解决我的脚本无法正常工作的问题时间值在输入中发生变化，我真的不明白为什么会这样，有什么想法吗？

var nametags = null;
var nametag = document.getElementById('names');
var speed = document.querySelector('input[id="speeds"]');

var partyTags = function() {
  clearInterval(nametags);
  if (nametags !== null) {
    nametags = null;
  } else {
    var delay = speed.value;
    nametags = setInterval(function() {
      document.getElementsByClassName('hud-party-tag')[0].value = '&#' +
        Math.random().toString(9).substring(9, 5) + ' ' + [nametag.value] + ' ' + '&#' +
        Math.random().toString(9).substring(9, 5);
    }, delay);
  }
}

speed.addEventListener("input", partyTags);

partyTags();

<input type="number" id="speeds" value="1000">
<input type="text" maxlength="35" id="names" value="NAME HERE">
<br>
<br>
<input type="text" class="hud-party-tag" disabled>

Answer 1

问题出在检查 nametag 的 NULL 值时，特别是当检测到输入事件时，第一次调用 partyTags() 进入IF 条件并将nametag 设置为NULL，此后该方法完成且间隔不更新。对 partyTags() 的下一次调用进入 ELSE 部分并更新间隔，依此类推...因此，请尝试下一段代码，看看它现在是否有效:

var nametags = null;
var nametag = document.getElementById('names');
var speed = document.querySelector('input[id="speeds"]');

var partyTags = function()
{
    clearInterval(nametags);
    var delay = speed.value;

    nametags = setInterval(
        function()
        {
            document.getElementsByClassName('hud-party-tag')[0].value = '&#' +
            Math.random().toString(9).substring(9, 5) + ' ' + [nametag.value] + ' ' + '&#' +
            Math.random().toString(9).substring(9, 5);
        },
        delay
    );
}

speed.addEventListener("input", partyTags);

partyTags();

<input type="number" id="speeds" value="1000">
<input type="text" maxlength="35" id="names" value="NAME HERE">
<br>
<br>
<input type="text" class="hud-party-tag" disabled>