setInterval如何处理花费超过所需间隔的回调函数？
我已经读过回调可能会收到迟到的毫秒数作为它的第一个参数,但是我无法找到为什么它会迟到(抖动或长时间运行的函数).
对于常见的浏览器,它的表现有多么不同？
$(document).ready(function(){
setInterval(swapImages(),1000);
function swapImages(){
var active = $('.active');
var next = ($('.active').next().length > 0) ? $('.active').next() : $('#siteNewsHead img:first');
active.removeClass('active');
next.addClass('active');
}
});
我有13个图像包含在div中.第一个有一个名为active的类,这意味着它被显示.
交换图像功能选择活动图像并将其隐藏,并使下一图像处于活动状态.
但是,当页面加载时,该函数只能正常工作一次,而不是循环.
有任何想法吗？
我似乎无法在一个array.push函数上获得angular2视图,该函数是从setInterval异步操作调用的.
代码来自setInterval的这个angular plunkr示例:
我想做的是如下:
import {View, Component, bootstrap, Directive, ChangeDetectionStrategy, ChangeDetectorRef} from 'angular2/angular2'
@Component({selector: 'cmp', changeDetection: ChangeDetectionStrategy.OnPush})
@View({template: `Number of ticks: {{numberOfTicks}}`})
class Cmp {
numberOfTicks = [];
constructor(private ref: ChangeDetectorRef) {
setInterval(() => {
this.numberOfTicks.push(3);
this.ref.markForCheck();
}, 1000);
}
}
@Component({
selector: 'app',
changeDetection: ChangeDetectionStrategy.OnPush
})
@View({
template: `
<cmp><cmp>
`,
directives: [Cmp]
})
class App {
}
bootstrap(App);<!DOCTYPE html>
<html>
<head>
<title>angular2 playground</title>
<script src="https://code.angularjs.org/tools/traceur-runtime.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script data-require="jasmine" data-semver="2.2.1" src="http://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine.js"></script> …我想在 setinterval() 中每秒更新一次状态，但它不起作用。我是 React hook 的新手，所以无法理解为什么会发生这种情况。请查看以下代码片段并给我建议。
// State definition
const [gamePlayTime, setGamePlayTime] = React.useState(100);
let targetShowTime = 3;
.........................
// call function
React.useEffect(() => {
gameStart();
}, []);
.............
const gameStart = () => {
gameStartInternal = setInterval(() => {
console.log(gamePlayTime); //always prints 100
if (gamePlayTime % targetShowTime === 0) {
//can not get inside here
const random = (Math.floor(Math.random() * 10000) % wp("70")) + wp("10");
const targetPosition = { x: random, y: hp("90") };
const spinInfoData = getspinArray()[Math.floor(Math.random() * …所以,我使用附加到onClick的setInterval在这个函数中有一个无限循环.问题是,我无法在onClick中使用clearInterval来阻止它.我认为这是因为当我将一个clearInterval附加到onClick时,它会杀死一个特定的间隔,而不是该函数.有什么办法可以通过onClick 杀死所有间隔吗？
这是我的.js文件和我正在进行的调用
input type="button" value="generate" onClick="generation();
input type="button" value="Infinite Loop!" onclick="setInterval('generation()',1000);"
input type="button" value="Reset" onclick="clearInterval(generation(),80;" // This one here is giving me trouble.
如果我没有弄错,eval会在给定的字符串中执行有效的代码
eval("alert('hey')");
和
setTimeout("alert('hey')",1000);
做同样的事情,只有一个计时器.设置超时和eval一样有风险吗？
现在我试图找到一种方法来检测元素HTML何时发生了变化.
我正在尝试:
var a, b;
setInterval(function() {
a = $('#chat').text();
}, 150);
setInterval(function() {
b = $('#chat').text();
if (a !== b) {
alert("There has been a new message.");
}
}, 200);?
我做的是每隔150毫秒我检查一次#chat的HTML然后每隔200秒我再次检查HTML,然后检查变量a是否等于变量b它们将来我会这样做但是现在我只是提醒一些事情
你可以在这里看到它:http://jsfiddle.net/MT47W/
显然这种方式不起作用,根本不是很准确.有没有更好的/不同的做/实现这个？
感谢您的帮助,我一直在努力弄清楚如何做到这一点好一周,但我找不到解决方案,我希望我把这个问题发布在正确的地方,并且在合适的时间.
我已成功设法使用setInterval函数在400毫秒后点击div.我的问题是它不断运行,我只需要执行一次的函数.快速搜索后,我发现clearInterval可以停止setInterval.我错误地使用了这个吗？closeAnimation函数正在点击执行.我在此页面上的代码之后对我的代码进行了建模:http://www.w3schools.com/jsref/met_win_setinterval.asp
function closeAnimation() {
setInterval(function(){hide()}, 400);
clearInterval(stopAnimation);
}
var stopAnimation = setInterval({hide()}, 400);
我注意到一对夫妇的JavaScript库,利用的setInterval,该库将事件侦听器绑定到window的unload事件,以清除使用所有创建的间隔clearInterval.
一个例子是History.js,它保持"设置间隔列表,在卸载文档时清除".
片段:
// ====================================================================
// Interval record
/**
* History.intervalList
* List of intervals set, to be cleared when document is unloaded.
*/
History.intervalList = [];
/**
* History.clearAllIntervals
* Clears all setInterval instances.
*/
History.clearAllIntervals = function(){
var i, il = History.intervalList;
if (typeof il !== "undefined" && il !== null) {
for (i = 0; i < il.length; i++) {
clearInterval(il[i]);
}
History.intervalList = null;
}
}; …我想用2个按钮创建一个页面,'STAY'和'Leave'.按钮下方有一个iFrame.当页面第一次加载时,iFrame会在10秒后自动刷新.当用户点击STAY按钮时,它将停止刷新.之后,如果他点击LEAVE按钮,iFrame将在10秒后再次开始刷新.我正在使用此代码:
$(document).ready(function() {
var refreshIntervalId = setInterval( "update()", 10000 );
$('#leave').click(function () {
var refreshIntervalId = setInterval( "update()", 10000 );;
})
$('#stay').click(function () {
clearInterval(refreshIntervalId);
})
});
function update(){
var url = "load.php";
$('iframe#ifrm').attr('src', url);
}
<div id="bar">
<div class= "button" id="stay">
<a>Stay</a>
</div>
<div class= "button" id="leave">
<a>Leave</a>
</div>
</div>
但它不起作用,我是否以错误的方式使用clearInterval？
setinterval ×10
javascript ×8
jquery ×3
angular ×1
arrays ×1
asynchronous ×1
browser ×1
detect ×1
eval ×1
function ×1
onclick ×1
react-hooks ×1
reactjs ×1
settimeout ×1