zoukankan      html  css  js  c++  java
  • JS Enter键实现Tab键功能

    <!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>
    </head>

    <body>
    <form>
    <input name="" type="text" />
    <input name="" type="text" /><input name="" type="text" /><input name="" type="text" /><input name="" type="text" /><input name="" type="text" />
    <input name="" type="text" /><input type="button" /><input type="password" />
    </form>
    </body>
    </html>

    <script language="javascript">
    document.onkeydown=function(evt){
     //document.all可以判断浏览器是否是IE,是页面内所有元素的一个集合
     var isie = (document.all) ? true : false;
     var key;
     var srcobj;
     // if the agent is an IE browser, it's easy to do this.
     if (isie) {
      key = event.keyCode;
      srcobj=event.srcElement;//event.srcElement,触发这个事件的源对象
     }
     else {
      key = evt.which;
      srcobj=evt.target;//target是Firefox下的属性
     }
     if(key==13 && srcobj.type!='button' && srcobj.type!='submit' &&srcobj.type!='reset' && srcobj.type!='textarea' && srcobj.type!='') {
      if(isie)
       event.keyCode=9;//设置按键为tab键
      else {
       var el=getNextElement(evt.target);
       if (el.type!='hidden')
        ;   //nothing to do here.
       else
        while(el.type=='hidden')
         el=getNextElement(el);
       if(!el)
        return false;
       else
        el.focus();
      }
     }
    }

    function getNextElement(field) {
     var form = field.form;
     for(var e = 0; e < form.elements.length; e++) {
      if (field == form.elements[e])
      break;
     }
     return form.elements[++e % form.elements.length];
    }

    </script>

  • 相关阅读:
    硬件的那些事
    seaJS学习资料参考
    nodejs前端自动化构建
    移动端开发的坑【持续更新...】
    【retina】手机上 1PX 边框
    【面试季之三】IE6兼容问题
    【面试季二】前端性能优化
    【面试季一】若干前端面试题
    【面试的坑】行内元素是否可以设置宽高
    Bootstrap和IE何时能相亲相爱啊~
  • 原文地址:https://www.cnblogs.com/zhangzhiping35/p/10673670.html
Copyright © 2011-2022 走看看