我想动态更改 setInterval 的间隔值。由于 setInterval 回调函数中存在循环，我正在苦苦挣扎。我在stackoverflow上看到了太多问题。但没有任何解决方案可以帮助我。如果有人知道答案，请举例说明。谢谢。
这是我的代码。
<html>
<head>
<script type="text/javascript">
var speed = 10;
function updateSlider(slideAmount) {
speed = slideAmount;
}
function load() {
downloadUrl("points.xml", function (data) {
/* code */
abc();
});
function abc() {
function track() {
/* code */
downloadUrl("points.xml", function (data) {
var xml = data.responseXML;
var points = xml.documentElement.getElementsByTagName("point");
var i = 0;
setInterval(function () {
if (i != points.length) {
alert(speed);
}
i++;
}, 100 * speed);
});
}
track();
}
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest;
request.onreadystatechange = function () {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.setRequestHeader("Content-type", "text/xml");
request.send(null);
}
function doNothing() {
}
</script>
</head>
<body onload="load();">
<div id="slider">
5% <input id="slide" type="range" min="1" max="20" step="5" value="10" onchange="updateSlider(this.value)" /> 200%
</div>
<div id="chosen">10</div>
</body>
诀窍是不要使用setInterval https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval，并使用setTimeout https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout相反，在循环中。
setInterval读取你给它的计时值once，根据这个时间安排，然后忘记它。你唯一能做的就是clearInterval(myInterval)如果您已将间隔分配给变量，例如myInterval.
setTimeout大致相同，只是我们可以使用它来手动循环同一函数。手动循环允许我们改变时间setTimeout每次超时后。
这是一个简单的例子。向左移动滑块可以加快滴答速度，向右移动则可以减慢滴答速度。
DEMO http://jsbin.com/soloyo/1/edit?html,js,output
var timing = 250,
i = 0,
output = document.getElementById('output');
function loop() {
i++;
output.innerHTML = i;
window.setTimeout(loop, timing);
}
document.querySelector('input[type="range"]').addEventListener('change', function (e) {
timing = parseInt(this.value);
});
loop();
<input type="range" min="100" max="500" value="250" />
<div id="output"></div>
作为旁注：使用这种模式是almost总是比使用更好的选择setInterval. setInterval运行函数执行时间可能比间隔持续时间更长的机会。循环永远不会发生这种情况setTimeout如果你打电话setTimeout最后在函数中。
文档：
- WindowTimers.setInterval https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval
- WindowTimers.setTimeout https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
