<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>test javascript</title>
    <script type="text/javascript">
        window.onload = function() {
            var EventUtil = {
                addhandler:function(element,type,handler) {
                    if(element.addEventListenter) {
                        element.addEventListenter(type,handler,false);
                    } else if (element.attachEvent) {
                        element.attachEvent("on"+type,handler);
                    } else {
                        element["on"+type] = handler;
                    }
                },

                getEvent:function(event) {
                    return event?event:window.event;
                },

                getTarget:function() {
                    return event.target || event.srcElement;
                },

                preventDefault:function() {
                    if(event.preventDefault) {
                        event.preventDefault();
                    } else {
                        event.returnValue = false;
                    }
                },

                stopPropagation:function() {
                    if(event.stopPropagation) {
                        event.stopPropagation();
                    } else {
                        event.cancelBuddle = true;
                    }
                },

                removehandler:function(element,type,handler) {
                    if(element.removeEventListenter) {
                        element.addEventListenter(type,handler,false);
                    } else if (element.detachEvent) {
                        element.detachEvent("on"+type,handler);
                    } else {
                        element["on"+type] = null;
                    }
                },

                getCharCode: function(event) {
                    if(typeof event.charCode == "number") {
                        return event.charCode;
                    } else {
                        return event.keyCode;
                    }
                },

                getClipboardText: function(event) {
                    var clipboardData = event.clipboardData || window.clipboardData;
                    return clipboardData.getData("text");
                },

                setClipboardText: function(event,value) {
                    if(event.clipboardData) {
                        return event.clipboardData.setData("text/plain",value);
                    } else if(window.clipboardData){
                        return window.clipboardData.setData("text",value);
                    }
                }

            }

            var textarea = document.forms[0].elements["text"];
            var button = document.getElementById("button");

            (function() {
                function tabForward(event) {
                    event = EventUtil.getEvent(event);
                    var target = EventUtil.getTarget(event);

                    if(target.value.length == target.maxLength) {
                        var form = target.parentElement;

                        for(var i=0,len = form.elements.length;i<len-1;i++) {
                            if(form.elements[i] == target) {
                                form.elements[i+1].focus();
                                return ;
                            }
                        }
                    }

                }

                var textTel1 = document.getElementById("txtTel1");
                var textTel2 = document.getElementById("txtTel2");
                var textTel3 = document.getElementById("txtTel3");
                var textTel4 = document.getElementById("txtTel4");

                EventUtil.addhandler(textTel1,"keyup",tabForward);
                EventUtil.addhandler(textTel2,"keyup",tabForward);
                EventUtil.addhandler(textTel3,"keyup",tabForward);
                EventUtil.addhandler(textTel4,"keyup",tabForward);

            })();
        }
    </script>
</head>
<body>
<form>
    <input type="text" name="tel1" id="txtTel1" maxlength="3" />
    <input type="text" name="tel2" id="txtTel2" maxlength="3" />
    <input type="text" name="tel3" id="txtTel3" maxlength="3" />
    <input type="text" name="tel4" id="txtTel4" maxlength="3" />
</form>
</body>
</html>

input自动获取焦点的更多相关文章

  1. element el-input 自动获取焦点和IE下光标位置解决方法

    在实际开发中我们经常会碰到这样的场景,就是有input的地方都喜欢切换过去input自动获取焦点. 如果这个问题是在input中,很容易就实现了,但是element里面的el-input看源码,其实不 ...

  2. vue动态设置Iview的多个Input组件自动获取焦点

    1.html,通过ref=replyBox设置焦点元素,以便后续获取 // 动态设定自动获取焦点按钮 <p class="text-right text-blue fts14 ptb1 ...

  3. 鼠标经过INPUT时自动获取焦点

    鼠标经过INPUT时自动获取焦点 <input type="text" name="addr" onMouseOver="this.focus( ...

  4. jquery--blur()事件，在页面加载时自动获取焦点

    jquery--blur()事件会在页面加载时自动获取焦点,应将onblur写到html标签中 <div class="inputbox"> <input typ ...

  5. 【小程序】bindconfirm点击小键盘触发事件、focus自动获取焦点

    最近在写小程序,项目要求写一个搜索框,在进入页面时就触发input的事件,调出键盘,点小键上的搜索按钮 就触发搜索事件,分享一下. bindconfirm 是点击小键盘上的搜索按钮就触发要执行的方法 ...

  6. 页面一刷新让文本框自动获取焦点-- 和自定义v-focus指令

    <body> <div id="app"> <input type="text" value="" id=&q ...

  7. Vue--由自动获取焦点引出的DOM、mounted、自定义指令

    一.自动获取焦点的DOM实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  8. 让EditText不能自动获取焦点

    在activity中放置了1个或1个以上的EditText,进入该activity的时候第一个EditText会接收焦点,我希望里面所有的EditText默认是不接收焦点的,该怎么做呢? 方法: 在第 ...

  9. 安卓应用开发用户体验之禁止EditText自动获取焦点

    一.问题描述: 在安卓应用开发时,经常会在同一个页面有许多不同的控件,在用户操作时,如何正确的在这些控件之间来回切换是良好用户体验的重要问题.可能会碰到如下问题:在点击页面内某控件时(假设控件为Spi ...

随机推荐

  1. c# windows编程控件学习-1

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  2. PostgreSQL的9.4已经发布（译）

    http://www.postgresql.org/about/news/1557/ 2014年12月18日,PostgreSQL全球开发小组发布PostgreSQL9.4,PostgresQL是世界 ...

  3. CSS实现垂直水平居中

    HTML结构: <div class="wrapper"> <div class="content"></div> < ...

  4. GCD,用同步/异步函数,创建并发/串行队列

    队列  第一个参数:C语言字符串,标签 第二个参数: DISPATCH_QUEUE_CONCURRENT:并发队列 DISPATCH_QUEUE_SERIAL:串行队列 dispatch_queue_ ...

  5. 苹果IPhone手机由于更新了IOS7 Beta测试版导致“激活出错”后，如何还原电话本和照片方法

    苹果这狗日的,手段果然狠,因为用户提前升级了测试版又没有更新正式版,就突然把手机变砖头,既不让升级正式版,也不让备份手机中的信息,确实有必要这样吗? 我的手机是IPone4s,在看了6月Apple W ...

  6. R正则表达式的问题

    今天在处理R的正则表达式的时候发现,R的正则式中的转义字符和linux.python等的还不一样. Linux是使用"\",而R中则使用"[]"! # 我想要将 ...

  7. Python 决策树的构造

    上一节我们学习knn,kNN的最大缺点就是无法给出数据的内在含义,而使用决策树处理分类问题,优势就在于数据形式非常容易理解. 决策树的算法有很多,有CART.ID3和C4.5等,其中ID3和C4.5都 ...

  8. 移动POS机

    1.怎么识别手刷机所属公司是否是二清公司,甚至是多清 去银行,手机银行,网上银行查询该笔款是哪里汇出的,如果是银行或合法支付公司汇出,一般为一清机,如果是个人或无支付牌照的支付公司,一般为二清机: 已 ...

  9. jQuery的ajax()、post()方法提交数组，参数[] 问题

    当用$.ajax()向后台提交参数时,如果参数中数组的话一般在后台会用List,或Integer[] 等数组对象进行接收. 比如: $.ajax({   type: "POST", ...

  10. C string.h 常用函数

    参考:http://womendu.iteye.com/blog/1218155 http://blog.csdn.net/zccst/article/details/4294565 还有一些,忘记了 ...