如何在不刷新浏览器的情况下停止代码外 Javascript 中的 setInterval 循环？

Question

这可能是一个很幼稚的问题，但我确实需要一些帮助。

在写这个 post 之前，我在 JSBin 上编程。结果在我没有意识到的情况下，我运行一个 setInterval 循环提示输入 userInput 并且它一直在循环，使我无法单击任何地方来更改代码来修复循环。它一直在重复和重复。它到了我不得不刷新并丢失所有硬写代码的地步（我没有登录，所以我的代码没有保存）！我想下次避免这种情况。

所以，我的问题是如何停止任何此类 setInterval 循环，以便我能够访问我的代码并更改它并重新运行它。 下面是演示我的问题的代码，如果您在 JSBin.com 上尝试运行ning 它（显然，这不是我之前写的代码）。 如您所见，我无法点击我的代码以任何方式更改（或保存）它，这意味着我丢失了所有代码！

这似乎是一个无用的问题，但我真的很想知道修复它的方法，也许从开发人员工具修复它会帮助我熟悉它拥有的大量工具:P。如果您知道解决方案，请帮助我。

感谢您花时间帮助我！我很感激。

setInterval(demo,1);
function demo()
{
     var name = prompt("Enter your name: ");
}

Answer 1

这是一种 hack 并且应该只用于像 OP 中暴露的情况，但是，
几乎所有实现都使用整数作为 timerid ，每次调用时都会增加。

那么您可以做的就是清除在页面上创建的所有超时。
为此，您需要首先了解我们所在的 timerid，然后在循环中调用 cleatTimeout 或 clearInterval（它们做同样的事情），直到到达最后一个调用：

function stopAllTimers() {
  const timerid = setTimeout(_=>{}); // first grab the current id
  let i=0;
  while(i < timerid) {
    clearTimeout(i); // clear all
    i++;
  }
};
btn.onclick = stopAllTimers;

// some stoopid orphan intervals
setInterval(()=>console.log('5000'), 5000);
setInterval(()=>console.log('1000'), 1000);
setInterval(()=>console.log('3000'), 3000);
const recursive = () => {
  console.log('recursive timeout');
  setTimeout(recursive, 5000);
};
recursive();

<button id="btn">stop all timeouts</button>

Answer 2

假设开发工具已关闭，几乎同时点击 esc 和 f12。这应该打开开发工具。如果它不继续尝试直到它成功。

打开后，点击 esc 和 f8。再次重试，直到它在代码中的任意点停止 javascript 执行。

在 "sources" 选项卡中，找到为您编写的内容生成的脚本（顺便说一下，我不知道它在 JSBin 中的样子）并从字面上删除 var name = prompt("Enter your name: "); 行。再次点击 f8 将继续执行，就好像 "new" 代码是运行。在刷新页面之前，这应该可以让您最多 copy/paste 从站点本身释放代码

Answer 3

另一种选择是在开发人员工具 "Elements" 面板中搜索 iframe（即使主文档由于 prompt 的阻止而没有响应，这应该是可行的）- 然后，恰到好处单击 iframe 元素并将其删除，无需键入任何 Javascript。（或者，如果您愿意，可以 select 带 querySelector 的 iframe 并将其删除，例如 document.querySelector('iframe').remove()）

如何在不刷新浏览器的情况下停止代码外 Javascript 中的 setInterval 循环？

How to stop a setInterval Loop in Javascript outside of code without refreshing the browser?

javascript

developer-tools

setinterval

jsbin

google-developer-tools