假设有一个函数x()可以做一些动画
如果我循环x(),说100次需要<1ms(平均/调用)来执行它但是,如果我这样做setInterval(x, 100),平均需要> 150ms才能执行
由于这种怪癖,我的动画很不稳定.(我的for-loop测试的原因是确保x()不是瓶颈)
是否有任何技术/模式可以确保我的计时器以同一时间和给定间隔被激发(以低间隔)并且不受浏览器的支配？
更新:为什么以下内容会针对不同的时间间隔给出不同的结果
http://jsfiddle.net/zQQgH/7/
更新2:感谢lincolnk,我已经为任何人更新了代码以查看它 http://jsfiddle.net/zQQgH/22/
我正在研究这个简单的时钟作为学习项目
<html>
<head>
<script type="text/javascript">
window.onload = function()
{
var da = document.getElementById("display_area");
function setClockDisplay()
{
var time = new Date();
var hour = time.getHours();
var minute = time.getMinutes();
var second = time.getSeconds();
var currentTime = hour + ":" + minute + ":" + second;
da.innerHTML = currentTime;
}
setInterval(setClockDisplay(), 1000);
}
</script>
</head>
<body>
<p id="display_area"></p>
</body>
</html>
当我转到页面时,它会显示最初加载页面时的时间戳,但不会像我想的那样每秒更新一次.我错过了什么？
首先我想提两件事，
一：我的代码并不完美（特别是 eval 部分） - 但我想为自己尝试一些东西，看看我是否可以复制 jQuery Animation 功能，所以请原谅我的“不好”的做法，请不要建议我使用 jQuery，我想尝试一下。
二：这段代码还没有完成，我只是想弄清楚是什么让它工作得不好。
所以动画运行了大约 12 秒，而我输入的持续时间参数是 15 秒，我做错了什么？
function animate(elem, attr, duration){
if(attr.constructor === Object){//check for object literal
var i = 0;
var cssProp = [];
var cssValue = [];
for(key in attr) {
cssProp[i] = key;
cssValue[i] = attr[key];
}
var fps = (1000 / 60);
var t = setInterval(function(){
for(var j=0;j<cssProp.length;j++){
if(document.getElementById(elem).style[cssProp[j]].length == 0){
//asign basic value in css if the object dosn't have one.
document.getElementById(elem).style[cssProp[j]]= 0;
} …我制作了一段间隔的动画.这是我的脚本:
var count = 0;
var countSecond = -40;
function arrowAnimation() {
if (count > 40) {
clearInterval();
}
$('.list-what-we-do .arrow').css({
top: (count++) + 'px'
});
}
function arrowAnimationSecond() {
if (countSecond > 0) {
clearInterval();
}
$('.list-what-we-do .arrow').css({
right: (countSecond++) + 'px'
});
}
setInterval(arrowAnimation, 5);
setInterval(arrowAnimationSecond, 5);
现在我的问题.我怎么能停止间隔.我使用了clearInterval.但这不起作用.我怎样才能解决这个问题？谢谢你的帮助!
我有这个代码块,它给我发出以下错误:
this.modifyAspect('health');
^
TypeError: Object #<Timer> has no method 'modifyAspect'
at Timer.tick (/Users/martinluz/Documents/Nodes/societ/node_modules/societal/societal.js:93:9)
at Timer.exports.setInterval.timer.ontimeout (timers.js:234:14)
我已经打过电话modifyAspects()的Societ.modifyAspects,this.modifyAspects()而且modifyAspects(),也只有得到了错误.任何帮助或建议表示赞赏......
这是代码:
var Societ = function(inboundConfig){
this.population = undefined;
this.owner_id = undefined;
this.owner_name = undefined;
this.config = inboundConfig;
this.aspects = {
education:{
facilities: undefined,
rating: undefined
},
health: {
facilities: undefined,
rating: undefined
}
};
this.modifiers = {
health: 1,
education: 2,
population: 2
};
this.tickio = function(){
console.log('tickio');
}
return{
config: this.config,
bootstrap: function(){
this.owner_id …我正在编写一个脚本,其中包含需要每10分钟调用一次的函数.另外,为了告知用户在重新加载函数之前还剩多少时间(通过AJAX,但现在这不相关),我放了一个小的回归计时器.
这是主要结构:
$(document).ready(function () {
// Test's function
function loadDate() {
var myDate = new Date();
$("#dateload").html(myDate);
};
// Startup Variables
countermin = 10; // 10 minutes
countersec = 60;
minpass = 0;
secpass = 0
// Showing info before timer.
$("#reloadtime").html("Function will be reloaded in " + countermin + "m<b>" + (60 - countersec) + "</b>s<br/>(countersec's value: " + countersec + " - secpass' value: " + secpass + ")");
$("#timescalled").text("The date function has been called " + minpass …我有一个看起来像这样的javascript数组
var myArr = [1,2,3,4,5,6,7,8,9];
我每秒都有一个setInterval函数.每次触发函数时,我需要重新排序数组,看起来像这样[2,3,4,5,6,7,8,9,1],然后下一次[3,4,5,6,7,8] ,9,1,2] ......这是最好的方法.
你能告诉我我的代码有什么问题吗？
while(buttonPressed) {
setInterval(function () {
food = food + farms + (farmers/2);
updateFood();
}, 1000);
}
我有一个食物价值,根据几个因素(农场,农民)自动,更快或不增加.它在没有循环的情况下运行良好,但由于某种原因,只有在我按下此按钮后才能执行此功能,这是我的问题.
我检查了控制台,并且var按钮默认为false,在我按下按钮后变为true,所以它应该工作:/我需要你的帮助:D
谢谢你们回复:)
我试图得到它所以确认窗口每n秒弹出一次,用户输入提示,但无论输入如何,都会立即弹出确认窗口.我究竟做错了什么？
这是我的按钮的样子:
<button onclick="timer_prompt()">FUN</button>
我的简单功能:
function timer_prompt()
{
var seconds = prompt("Enter Time Interval In Seconds Please");
seconds = seconds*1000;
if(seconds>0)
{
setInterval(confirm_timer(), seconds);
}
else
{
alert("You entered invalid content");
}
}
function confirm_timer()
{
confirm("YOU HAVE SET A TIMER!!!");
}
我正在尝试编写一个小蛇游戏，但在改变蛇的方向时遇到了麻烦。我在下面包含了整个组件。
我看到以下错误：
this.setState is not a function
这是在changeDirection方法中引起的。
请参阅下面的完整代码：
export default class Example extends Component {
constructor(props){
super(props);
this.state = {
snakeLeftPos: 0,
snakeDirection: 'right',
boardWidth: 20,
boardHeight: 20
};
}
componentDidMount() {
document.onkeydown = this.changeDirection;
setInterval(() => {
this.moveSnake();
}, 1000);
}
moveSnake() {
const { boardWidth, snakeDirection} = this.state;
if(snakeDirection === 'right') {
this.setState((prevState) => {
return snakeDirection: prevState.snakeDirection + 20
});
}
//same logic for other directions
}
changeDirection(e) {
switch(e.keyCode) {
case 37:
this.setState(() …javascript ×10
setinterval ×10
jquery ×3
timer ×2
arrays ×1
duration ×1
increment ×1
intervals ×1
loops ×1
node.js ×1
reactjs ×1
timing ×1
while-loop ×1