var i = 1; var timer = setInterval(function() { i++; //3 4 5 6 console.log(i); }, 1000);当i=1的时候 console.log（i）----3 4 5 6 7....当I=0的时候 浏览器直接卡死 是为什么？我还是不太了解这个定时器有没有明白的========================================================================<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>ul { margin:0; padding:0;}li { list-style:none;}#wrap { width:300px; height:200px; padding:20px;}ul { width:300px; height:30px;}ul li { width:70px; height:30px; line-height:30px; text-align:center; background:#69F; float:left; cursor:pointer;}img { width:230px; height:170px; float:left;}a { display:inline-block; width:70px; height:40px; line-height:40px; color:#000; text-align:center; background:#CCC; text-decoration:none;}.active1 { background:#FF3;}.active2 { background:#069;}</style></head><body><div id="wrap"> <ul> <li>菜单一</li> <li>菜单二</li> </ul> <img src="" /> <a href="#"></a> <a href="#"></a> <a href="#"></a></div><script> var oUl=document.getElementsByTagName("ul")[0]; var oLi=document.getElementsByTagName("li"); var oImg=document.getElementsByTagName("img")[0]; var aHref=document.getElementsByTagName("a"); var arrText1=["图片一","图片二","图片三"]; var arrText2=["图片四","图片五","图片六"]; var arrUrl1=["img/1.jpg","img/2.jpg","img/3.jpg"]; var arrUrl2=["img/1.png","img/2.png","img/3.png"]; var num=0; var timer=null; //初始化 oImg.src=arrUrl1[num]; oLi[num].className="active1"; aHref[num].className="active2"; for (var i=0; i<aHref.length; i++) { aHref[i].innerHTML=arrText1[i%arrText1.length]; } //菜单一 for (var i=0; i<oLi.length; i++) { oLi[0].onclick=function () { for (var i=0; i<oLi.length;i++) { oLi[i].className=""; } this.className="active1" oImg.src=arrUrl1[num]; for (var i=0; i<aHref.length; i++) { aHref[i].innerHTML=arrText1[i%arrText1.length]; aHref[i].className=""; aHref[0].className="active2"; } getMouse(arrUrl1); }; //aHref 公用样式 function getMouse(arrUrl) { for (var i=0; i<aHref.length; i++) { aHref[i].index=i; //点击 aHref[i].onclick=function () { for (var i=0; i<aHref.length; i++) { aHref[i].className=""; } this.className="active2"; oImg.src=arrUrl[this.index%arrUrl.length]; } //aHref 移入 aHref[i].onmouseover=function () { for (var i=0; i<aHref.length; i++) { aHref[i].className=""; } this.className="active2"; oImg.src=arrUrl[this.index%arrUrl.length]; } } } getMouse(arrUrl1); //菜单二 oLi[1].onclick=function () { for (var i=0; i<oLi.length;i++) { oLi[i].className=""; } this.className="active1" for (var i=0; i<aHref.length; i++) { aHref[i].innerHTML=arrText2[i%arrText2.length]; oImg.src=arrUrl2[num]; aHref[i].className=""; aHref[0].className="active2"; } getMouse(arrUrl2); }// 问题的原因：这种重复定时器的规则有两个问题：1.某些间隔会被跳过 2.多个定时器的代码执行时间可能会比预期小。======================================================================= var timer=setInterval(getChange,1000); function getChange () { for (var i=0; i<aHref.length; i++) { aHref[i].className=""; } num++; aHref[num].className="active2"; console.log(num); if (num==arrUrl1.length) { for (var i=0; i<oLi.length;i++) { oLi[i].className=""; } oLi[1].className="active1" num=-1; oImg.src=arrUrl2[num]; } ｝=========================================================================</script></body></html>==================================================================关于使用定时器 我设置的是num=0； 定时器每执行一次 num++； num初始值是0； 但是执行的时候 num的变化值是 =================================================================目前解决的代码：var timer=setTimeout(function(){ num++; if (num==arrUrl1.length) { for (var i=0; i<oLi.length;i++) { oLi[i].className=""; } if (onOff) { oLi[1].className="active1"; oImg.src=arrUrl2[num]; onOff=false; } else { oLi[0].className="active1"; oImg.src=arrUrl1[num]; onOff=true; } num=0; oImg.src=arrUrl2[num]; } for (var i=0; i<aHref.length; i++) { aHref[i].className=""; } aHref[num].className="active2"; for (var i=0; i<oLi.length; i++) { if (oLi[0].className!="") { oImg.src=arrUrl1[num]; } else { oImg.src=arrUrl2[num]; } } setTimeout(arguments.callee,1000);},1000)
添加回答
举报
0/150
提交
取消