                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /DOM事件探秘

代码疑问（全局变量和局部变量）

var data=['Phone5','Ipad','三星笔记本','佳能相机','惠普打印机','谢谢参与','50元充值卡','1000元超市购物券'],
    timer=null,
    flag=0;

window.onload=function(){
    var play=document.getElementById('play'),
        stop=document.getElementById('stop');

    // 开始抽奖
    play.onclick=playFun;
    stop.onclick=stopFun;

   // 键盘事件
   document.onkeyup=function(event){
      event = event || window.event;
      if(event.keyCode==13){
         if(flag==0){
           playFun();
           flag=1;
         }else{
           stopFun();
           flag=0;
         }
      }
   }
}

function playFun(){
	var title=document.getElementById('title');
	var play=document.getElementById('play');
	clearInterval(timer);
	timer=setInterval(function(){
	   var random=Math.floor(Math.random()*data.length);
	   title.innerHTML=data[random];
	},50);
    play.style.background='#999';
}

function stopFun(){
	clearInterval(timer);
	var play=document.getElementById('play');
	play.style.background='#036';
}

老师的源码中，第六行和第七行声明了两个变量，请问是全局变量吗？
如果是，为什么还要在playFun和stopFun这两个函数中进行获取？
我自己试了一下，把29行从函数内取出放在第8行，并把30、41行删掉，在浏览器中依旧可以使用，效果一样。

小感冒

2016-02-03

源自：DOM事件探秘 4-5

关注问题我要回答

965

操作

收起

1 回答

小感冒提问者
2016-02-03

var data=['Phone5','Ipad','三星笔记本','佳能相机','惠普打印机','谢谢参与','50元充值卡','1000元超市购物券'],
	timer=null,
	flag=0;
window.onload = function(){
	var play =document.getElementById('play'),
		stop =document.getElementById('stop'),
		title=document.getElementById('title');

	//开始抽奖
	play.onclick=playFun;
	stop.onclick=stopFun;

	//键盘事件
	document.onkeyup=function(event){
		event = event || window.event;
		if (event.keyCode==13) {
			if (flag==0) {
				playFun();
				flag=1;
			}else{
				stopFun();
				flag=0;
			};
		};
	}
}

function playFun(){
	clearInterval(timer);
	timer=setInterval(function(){
		var random=Math.floor(Math.random()*data.length);
		//console.log(random);在控制台显示		
		title.innerHTML=data[random];
	},50);
	play.style.background='gray';
	flag=1;
}

function stopFun(){
	clearInterval(timer);
	play.style.background='red';
	flag=0;

}

这是我写的，效果一样，stopFun和playFun两个函数同样也是写在了onload外面，并且没有重新再获取按钮，为什么一样可以调用onload里面的变量。

老师在视频里说的在onload外面是需要重新获取的，还是我理解错了，请大神们解答。