虽然写出来了但是有个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(); } // 执行脚本 } function Close(){ // 执行脚本 menu.style.display="none"; } }
就是键盘选择的时候,按到头(最上或者最下)就需要再按两下才能接上,这个问题我也知道出在哪,判断index时,如果是4就会有问题了,所以需要按两下。但是以目前水平确实没有好的办法