关于setInterval,出了一点问题

「已注销」 2012-08-09 08:46:49
我想在点击开始按钮时,小球开始移动 ,但为什么一加载完成小球就开始移动了呢??onclick事件处理程序在那呢 怎么没用???求教


<canvas id="draw" width="500px" height="200px"></canvas>
<button id ="start">开始</button>



var start = document.getElementById("start");
var draw = document.getElementById("draw");
var context = draw.getContext("2d");
var y = 50;
var i = 1;
function ball() {
context.clearRect(0,0,500,200);
context.fillStyle = 'red';
context.beginPath();
context.arc(100,y,20,0,Math.PI*2,false);
context.fill();
y = y + i;
if(y==20||y==180) {
i=i*-1;
}
}
start.onclick = setInterval(ball,5);
...全文
86 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
未知数 2012-08-09
  • 打赏
  • 举报
回复
改法已经被人说了,我说说原因
这句 start.onclick = setInterval(ball,5);
setInterval(ball,5)这是调用函数的写法,也就是说此时函数已经执行了,onclick成员获得了该函数的返回值(该定时器对象)
明白了么,执行到这一句时,定时器已经产生了,被你赋值给onclick成员了
当然楼上的写法是不合理的,每次点击都生成一个新的定时器,很不好

start.onclick = function(){setInterval(ball,5);start.onclick=null;}

或者
var timer;
start.onclick = function(){if(!timer) timer=setInterval(ball,5);}
scscms太阳光 2012-08-09
  • 打赏
  • 举报
回复
start.onclick  = function(){setInterval(ball,5)}
似梦飞花 2012-08-09
  • 打赏
  • 举报
回复
start.onclick =function(){ setInterval(ball,5)};
改成这样试试

87,991

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧