javascript实现依次输入input自动定焦


Posted in Javascript onDecember 23, 2014
<html> 

<head> 

<script type="text/javascript"> 

    function moveNext(object,index){ 

        if(object.value.length==4){ 

            document.forms[0].elements[index+1].focus(); 

        } 

    } 

    function showResult(){ 

        var f=document.forms[0]; 

        var result=""; 

        for(var i=0;i<4;i++){ 

            result+=f.elements[i].value; 

        } 

        alert(result); 

    }

</script>

</head> 

<body onload="document.forms[0].elements[0].focus();"> 

    <form> 

        <input type="text" size="3" maxlength="4" onkeyup="moveNext(this,0);"> 

        <input type="text" size="3" maxlength="4" onkeyup="moveNext(this,1);"> 

        <input type="text" size="3" maxlength="4" onkeyup="moveNext(this,2);"> 

        <input type="text" size="3" maxlength="4" onkeyup="moveNext(this,3);"> 

        <input type="button" value="显示" onclick="showResult();"> 

    </form> 

</body> 

</html>

javascript实现依次输入input自动定焦

javascript实现依次输入input自动定焦

javascript实现依次输入input自动定焦

javascript实现依次输入input自动定焦

代码很简单,功能非常实用,小伙伴们美化下就可以用到自己项目中了,是不是很炫酷

Javascript 相关文章推荐
永不消失的title提示代码
Feb 15 Javascript
Prototype Object对象 学习
Jul 12 Javascript
JavaScript运行机制之事件循环(Event Loop)详解
Oct 10 Javascript
jquery果冻抖动效果实现方法
Jan 15 Javascript
javascript中递归函数用法注意点
Jul 30 Javascript
js实现跨域的几种方法汇总(图片ping、JSONP和CORS)
Oct 25 Javascript
学习JavaScript设计模式(代理模式)
Dec 03 Javascript
基于js 各种排序方法和sort方法的区别(详解)
Jan 03 Javascript
JQuery Ajax动态加载Table数据的实例讲解
Aug 09 jQuery
深入理解JavaScript 中的执行上下文和执行栈
Oct 23 Javascript
微信小程序使用 vant Dialog组件的正确方式
Feb 21 Javascript
js实现圆形菜单选择器
Dec 03 Javascript
使用原生JS实现弹出层特效
Dec 22 #Javascript
jQuery基础知识小结
Dec 22 #Javascript
jQuery异步获取json数据方法汇总
Dec 22 #Javascript
jQuery的观察者模式详解
Dec 22 #Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
Dec 22 #Javascript
sails框架的学习指南
Dec 22 #Javascript
了不起的node.js读书笔记之mongodb数据库交互
Dec 22 #Javascript
You might like
基于pear auth实现登录验证
2010/02/26 PHP
php输出echo、print、print_r、printf、sprintf、var_dump的区别比较
2013/06/21 PHP
PHP开发微信支付的代码分享
2014/05/25 PHP
PHP数组游标实现对数组的各种操作详解
2016/01/26 PHP
PHP将二维数组某一个字段相同的数组合并起来的方法
2016/02/26 PHP
Thinkphp5 自定义上传文件名的实现方法
2019/07/23 PHP
响应鼠标变换表格背景或者颜色的代码
2009/03/30 Javascript
web 页面分页打印的实现
2009/06/22 Javascript
读jQuery之九 一些瑕疵说明
2011/06/21 Javascript
javascript 用函数语句和表达式定义函数的区别详解
2014/01/06 Javascript
jQuery之字体大小的设置方法
2014/02/27 Javascript
jquery 表格排序、实时搜索表格内容(附图)
2014/05/19 Javascript
node.js中的buffer.write方法使用说明
2014/12/10 Javascript
jQuery模拟黑客帝国矩阵效果实例
2015/06/28 Javascript
jquery淡入淡出效果简单实例
2016/01/14 Javascript
微信小程序 form组件详解及简单实例
2017/01/10 Javascript
vue中post请求以a=a&amp;b=b 的格式写遇到的问题
2018/04/27 Javascript
微信小程序实现页面左右滑动
2020/11/16 Javascript
[45:15]Optic vs VP 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
python显示天气预报
2014/03/02 Python
Python中统计函数运行耗时的方法
2015/05/05 Python
Python文件操作基本流程代码实例
2017/12/11 Python
python 实现数组list 添加、修改、删除的方法
2018/04/04 Python
Python的argparse库使用详解
2018/10/09 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python保存log日志,实现用log日志画图
2019/12/24 Python
opencv python 图片读取与显示图片窗口未响应问题的解决
2020/04/24 Python
python使用bs4爬取boss直聘静态页面
2020/10/10 Python
html5弹跳球示例代码
2013/07/23 HTML / CSS
测试工程师程序员求职信范文
2014/02/20 职场文书
实习指导老师评语
2014/04/26 职场文书
法人代表证明书格式
2014/10/01 职场文书
2014年护士工作总结范文
2014/11/11 职场文书
刑事辩护词范文
2015/05/21 职场文书
《绝招》教学反思
2016/02/20 职场文书
彻底卸载VMware虚拟机的超详细步骤记录
2022/07/15 Servers