雖然寫出來了但是有個bug看在坐有沒有大神能幫忙解決一下
window.onload=function(){ var?box=document.getElementById('divselect'), ????title=box.getElementsByTagName('cite')[0], ????menu=box.getElementsByTagName('ul')[0], ????as=box.getElementsByTagName('a'), ????????index=-1, flog=0; ??? ????//?點擊三角時 ????title.onclick=spread; ???? ???//?滑過滑過、離開、點擊每個選項時 for(var?i=0;i<as.length;i++){ ???as[i].onmouseover=gray; ????as[i].onmouseout=bland; as[i].onclick=cli; document.onkeyup=choose; } ??? ???//?點擊頁面空白處時 ???document.onclick=Close; function?choose(event){ event=event?||window.event; if(index<-1){ index=as.length; }else?if(index>as.length){ index=-1; }else{ menu.style.display="block"; } if(event.keyCode==40){ index+=1; for(var?j=0;j<as.length;j++){ as[j].style.backgroundColor="#FFF"; } as[index].style.backgroundColor="#ccc"; }else?if(event.keyCode==38){ index-=1; for(var?j=0;j<as.length;j++){ as[j].style.backgroundColor="#FFF"; } as[index].style.backgroundColor="#ccc"; }else?if(event.keyCode==13){ title.innerHTML=as[index].innerHTML; menu.style.display="none"; } } function?cli(){ title.innerHTML=this.innerHTML; } function?bland(){ this.style.backgroundColor="#FFF"; ???} function?gray(){ this.style.backgroundColor="#ccc"; ???}??? function?spread(event){ ??????event=event?||window.event; ??if(flog==0){ ??menu.style.display="block"; ??flog=1; ?? ??}else{ ??menu.style.display="none"; ??flog=0;?? ??} ??if(event.stopPropagation()){ ??event.stopPropagation(); ??}else{ event.cancelBubble();?? } ??//?執(zhí)行腳本 }? function?Close(){ ???????//?執(zhí)行腳本 ???menu.style.display="none"; ??? }? ?}
就是鍵盤選擇的時候,按到頭(最上或者最下)就需要再按兩下才能接上,這個問題我也知道出在哪,判斷index時,如果是4就會有問題了,所以需要按兩下。但是以目前水平確實沒有好的辦法
2017-06-05
你的 index 判斷那部分寫的有些不合理,你看看我的,判斷其實沒那么麻煩