<!doctype html><html><head>? ? <meta charset="UTF-8">? ? <title>下拉菜單</title>? ? <style type="text/css">body,ul,li{ margin:0; padding:0; font-size:13px;}ul,li{list-style:none;}#divselect{width:186px; margin:80px auto; position:relative; z-index:10000;}#divselect cite{width:150px; height:24px;line-height:24px; display:block; color:#807a62; cursor:pointer;font-style:normal;padding-left:4px; padding-right:30px; border:1px solid #333333;?background:url(xjt.png) no-repeat right center;}#divselect ul{width:184px;border:1px solid #333333; background-color:#ffffff; position:absolute; z-index:20000; margin-top:-1px; display:none;}#divselect ul li{height:24px; line-height:24px;}#divselect ul li a{display:block; height:24px; color:#333333; text-decoration:none; padding-left:10px; padding-right:10px;}</style>? ?<script type="text/javascript">window.onload=function(){var box=document.getElementById('divselect'),? ?title=box.getElementsByTagName('cite')[0],? ?menu=box.getElementsByTagName('ul')[0],? ?as=box.getElementsByTagName('a'),? ? ? ? index=-1;? ?? ? // 點(diǎn)擊三角時(shí)? ? title.onclick=function(event){? ? ? // 執(zhí)行腳本? ? ? event= event||window.event;? ? ? if(event.stopPropagation){? ? ? ? ? event.stopPropagation();? ? ? }else{? ? ? ? ? event.cancelBubble=true;? ? ? }? ? ? menu.style.display="block";? ? }/***鍵盤事件****************************************/document.onkeyup=function(e){? ? ? ? ? e=e || window.event;? ? ? ? ? for(var i=0;i<as.length;i++){? ? ? ? ? ? as[i].style.background='none';? ? ? ? ? }?if(e.keyCode==32){?menu.style.display="block";?}? ? ? ? ? // 如果按下了向下方向鍵? ? ? ? ? if(e.keyCode==40){? ? ? ? ? ? ?index++;? ? ? ? ? ? ?if(index>=as.length){? ? ? ? ? ? ? ?index=0;? ? ? ? ? ? ?}? ? ? ? ? ? ?as[index].style.background="#ccc";? ? ? ? ? }? ? ? ? ? // 如果按下了向上方向鍵? ? ? ? ? if(e.keyCode==38){? ? ? ? ? ? ?if(index<=0){? ? ? ? ? ? ? ?index=as.length;? ? ? ? ? ? ?}? ? ? ? ? ? ?index--; ??? ? ? ? ? ? ?as[index].style.background="#ccc"; ? ? ?? ? ? ? ? }? ? ? ? ? // 如果按下了回車鍵? ? ? ? ? if(e.keyCode==13 && index!=-1){? ? ? ? ? ? title.innerHTML=as[index].innerHTML;? ? ? ? ? ? for(var i=0;i<as.length;i++){? ? ? ? ? ? ? as[i].style.background='none';? ? ? ? ? ? }? ? ? ? ? ? menu.style.display='none';? ? ? ? ? ? index=-1; ? ?? ? ? ? ? }? ? ? ? } ??? ??? ?// 滑過(guò)滑過(guò)、離開、點(diǎn)擊每個(gè)選項(xiàng)時(shí)? ? ? // 執(zhí)行腳本? ? ? for(var i=0;i<as.length;i++ ){? ? ? ? ? as[i].onmouseover=function(){? ? ? ? ? ? ? this.style.backgroundColor="#CCC"? ? ? ? ? }? ? ? ? ? as[i].onmouseout=function(){? ? ? ? ? ? ? this.style.backgroundColor="#FFF"? ? ? ? ? }? ? ? ? ? as[i].onclick=function(){? ? ? ? ? ? ? title.innerHTML=this.innerHTML;? ? ? ? ? ? ? menu.style.display="none";? ? ? ? ? }? ? ? }? ?// 點(diǎn)擊頁(yè)面空白處時(shí)? ? ? ?// 執(zhí)行腳本? ? ? ?document.onclick=function(){? ? ? ? ? ?menu.style.display="none";? ? ? ?}?}? ? ?? ? ?? ?</script></head><body><div id="divselect">? ? ? <cite>請(qǐng)選擇分類</cite>? ? ? <ul>? ? ? ? ?<li id="li"><a href="javascript:;" selectid="1">ASP開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="2">.NET開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="3">PHP開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="4">Javascript開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="5">Java特效</a></li>? ? ? </ul>? ? </div></body></html>然后我把鍵盤事件放在后面就不能用了，鍵盤按鍵用不了<!doctype html><html><head>? ? <meta charset="UTF-8">? ? <title>下拉菜單</title>? ? <style type="text/css">body,ul,li{ margin:0; padding:0; font-size:13px;}ul,li{list-style:none;}#divselect{width:186px; margin:80px auto; position:relative; z-index:10000;}#divselect cite{width:150px; height:24px;line-height:24px; display:block; color:#807a62; cursor:pointer;font-style:normal;padding-left:4px; padding-right:30px; border:1px solid #333333;?background:url(xjt.png) no-repeat right center;}#divselect ul{width:184px;border:1px solid #333333; background-color:#ffffff; position:absolute; z-index:20000; margin-top:-1px; display:none;}#divselect ul li{height:24px; line-height:24px;}#divselect ul li a{display:block; height:24px; color:#333333; text-decoration:none; padding-left:10px; padding-right:10px;}</style>? ?<script type="text/javascript">window.onload=function(){var box=document.getElementById('divselect'),? ?title=box.getElementsByTagName('cite')[0],? ?menu=box.getElementsByTagName('ul')[0],? ?as=box.getElementsByTagName('a'),? ? ? ? index=-1;? ?? ? // 點(diǎn)擊三角時(shí)? ? title.onclick=function(event){? ? ? // 執(zhí)行腳本? ? ? event= event||window.event;? ? ? if(event.stopPropagation){? ? ? ? ? event.stopPropagation();? ? ? }else{? ? ? ? ? event.cancelBubble=true;? ? ? }? ? ? menu.style.display="block";? ? } ?? ?// 滑過(guò)滑過(guò)、離開、點(diǎn)擊每個(gè)選項(xiàng)時(shí)? ? ? // 執(zhí)行腳本? ? ? for(var i=0;i<as.length;i++ ){? ? ? ? ? as[i].onmouseover=function(){? ? ? ? ? ? ? this.style.backgroundColor="#CCC"? ? ? ? ? }? ? ? ? ? as[i].onmouseout=function(){? ? ? ? ? ? ? this.style.backgroundColor="#FFF"? ? ? ? ? }? ? ? ? ? as[i].onclick=function(){? ? ? ? ? ? ? title.innerHTML=this.innerHTML;? ? ? ? ? ? ? menu.style.display="none";? ? ? ? ? }? ? ? }? ?// 點(diǎn)擊頁(yè)面空白處時(shí)? ? ? ?// 執(zhí)行腳本? ? ? ?document.onclick=function(){? ? ? ? ? ?menu.style.display="none";? ? ? ?}?}? ? ? ? ? /***鍵盤事件****************************************/document.onkeyup=function(e){? ? ? ? ? e=e || window.event;? ? ? ? ? for(var i=0;i<as.length;i++){? ? ? ? ? ? as[i].style.background='none';? ? ? ? ? }?if(e.keyCode==32){?menu.style.display="block";?}? ? ? ? ? // 如果按下了向下方向鍵? ? ? ? ? if(e.keyCode==40){? ? ? ? ? ? ?index++;? ? ? ? ? ? ?if(index>=as.length){? ? ? ? ? ? ? ?index=0;? ? ? ? ? ? ?}? ? ? ? ? ? ?as[index].style.background="#ccc";? ? ? ? ? }? ? ? ? ? // 如果按下了向上方向鍵? ? ? ? ? if(e.keyCode==38){? ? ? ? ? ? ?if(index<=0){? ? ? ? ? ? ? ?index=as.length;? ? ? ? ? ? ?}? ? ? ? ? ? ?index--; ??? ? ? ? ? ? ?as[index].style.background="#ccc"; ? ? ?? ? ? ? ? }? ? ? ? ? // 如果按下了回車鍵? ? ? ? ? if(e.keyCode==13 && index!=-1){? ? ? ? ? ? title.innerHTML=as[index].innerHTML;? ? ? ? ? ? for(var i=0;i<as.length;i++){? ? ? ? ? ? ? as[i].style.background='none';? ? ? ? ? ? }? ? ? ? ? ? menu.style.display='none';? ? ? ? ? ? index=-1; ? ?? ? ? ? ? }? ? ? ? } ??? ? ?? ?</script></head><body><div id="divselect">? ? ? <cite>請(qǐng)選擇分類</cite>? ? ? <ul>? ? ? ? ?<li id="li"><a href="javascript:;" selectid="1">ASP開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="2">.NET開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="3">PHP開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="4">Javascript開發(fā)</a></li>? ? ? ? ?<li><a href="javascript:;" selectid="5">Java特效</a></li>? ? ? </ul>? ? </div></body></html>
求大神解釋為什么我這個(gè)代碼鍵盤事件放在后面就不能用了
健C
2016-07-25 21:41:19
