为了账号安全,请及时绑定邮箱和手机立即绑定

求大神指导为什么,阻止不了上下键同时滚动页面事件,已加上阻止语句,跪谢!


<!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;


    // 点击三角时

    title.onclick=function(event){

     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==40){

              e.preventDefault ? e.preventDefault() : e.returnValue = false;

             index++;

             if(index>=as.length){

               index=0;

             }

             as[index].style.background="#ccc";

          }

          // 如果按下了向上方向键

          if(e.keyCode==38){

             e.preventDefault ? e.preventDefault() : e.returnValue = false;

             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;    

          }

        }

}  


    // 滑过滑过、离开、点击每个选项时

    for(var i=0;i<as.length;i++){

     as[i].onmouseover=function(){

     this.style.background='#ccc';

        index=this.getAttribute("selectid")-1;

     }

     as[i].onmouseout=function(){

     this.style.background='none';

        index=-1;

     }    

     as[i].onclick=function(){

     title.innerHTML=this.innerHTML;

         for(var i=0;i<as.length;i++){

              as[i].style.background='none';

            }

          

            index=-1;    

     }

    }

    

    // 点击页面空白处时

    document.onclick=function(){

      menu.style.display='none';

       for(var i=0;i<as.length;i++){

              as[i].style.background='none';

            }

          

            index=-1;    

    }

}

   </script>

</head>

<body>

<div id="divselect">

      <cite>请选择分类</cite>

      <ul>

         <li id="li"><a href="javascript:;" selectid="1">ASP开发</a></li>

         <li><a href="javascript:;" selectid="2">.NET开发</a></li>

         <li><a href="javascript:;" selectid="3">PHP开发</a></li>

         <li><a href="javascript:;" selectid="4">Javascript开发</a></li>

         <li><a href="javascript:;" selectid="5">Java特效</a></li>

      </ul>

    </div>

</body>

</html>


正在回答

1 回答

我觉得是这里有问题

 if(e.keyCode==38){

             e.preventDefault ? e.preventDefault() : e.returnValue = false;

这个方法阻止的是特定事件的默认行为,这里要阻止事件的话难道不是比如keypress 或者keydown之类的事件吗,keyCode只是一个属性,并不是键盘的事件。

我是这样认为的,虽然不知道对不对。

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

求大神指导为什么,阻止不了上下键同时滚动页面事件,已加上阻止语句,跪谢!

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信