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 相关文章推荐
JS小框架 fly javascript framework
Nov 26 Javascript
JavaScript声明变量时为什么要加var关键字
Sep 29 Javascript
JavaScript中实现继承的三种方式和实例
Jan 29 Javascript
jQuery实现向下滑出的二级菜单效果实例
Aug 22 Javascript
JS简单实现多级Select联动菜单效果代码
Sep 06 Javascript
js实现导航吸顶效果
Feb 24 Javascript
使用JS组件实现带ToolTip验证框的实例代码
Aug 23 Javascript
微信小程序自定义弹窗wcPop插件
Nov 19 Javascript
vue-cli3中vue.config.js配置教程详解
May 29 Javascript
js实现简单掷骰子小游戏
Oct 24 Javascript
vue 实现单选框设置默认选中值
Nov 07 Javascript
解决echarts 一条柱状图显示两个值,类似进度条的问题
Jul 20 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
基于curl数据采集之单页面并行采集函数get_htmls的使用
2013/04/28 PHP
2014年最新推荐的10款 PHP 开发框架
2014/08/01 PHP
php程序总是提示验证码输入有误解决方案
2015/01/07 PHP
php ImageMagick windows下安装教程
2015/01/26 PHP
PHP时间和日期函数详解
2015/05/08 PHP
使用PHP接受文件并获得其后缀名的方法
2015/08/05 PHP
PHP判断用户是否已经登录(跳转到不同页面或者执行不同动作)
2016/09/22 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
laravel在中间件内生成参数并且传递到控制器中的2种姿势
2019/10/15 PHP
javascript下查找父节点的简单方法
2007/08/13 Javascript
通过url查找a元素应用案例
2014/04/29 Javascript
兼容主流浏览器的JS复制内容到剪贴板
2014/12/12 Javascript
通过sails和阿里大于实现短信验证
2017/01/04 Javascript
JS简单判断滚动条的滚动方向实现方法
2017/04/28 Javascript
利用node.js如何创建子进程详解
2017/12/09 Javascript
在Create React App中使用CSS Modules的方法示例
2019/01/15 Javascript
vue读取本地的excel文件并显示在网页上方法示例
2019/05/29 Javascript
js里面的变量范围分享
2020/07/18 Javascript
js轮播图之旋转木马效果
2020/10/13 Javascript
Python中使用strip()方法删除字符串中空格的教程
2015/05/20 Python
python简单分割文件的方法
2015/07/30 Python
Python3实现的简单三级菜单功能示例
2019/03/12 Python
scrapy-redis源码分析之发送POST请求详解
2019/05/15 Python
python处理document文档保留原样式
2019/09/23 Python
利用Python实现某OA系统的自动定位功能
2020/05/27 Python
详解Scrapy Redis入门实战
2020/11/18 Python
python爬虫快速响应服务器的做法
2020/11/24 Python
HTML5 实现一个访问本地文件的实例
2012/12/13 HTML / CSS
美国最大的存储市场:SpareFoot
2018/07/23 全球购物
秋季开学典礼主持词
2014/03/19 职场文书
致共产党员倡议书
2014/04/16 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
财务负责人岗位职责
2015/02/03 职场文书
2015年实习单位评语
2015/03/25 职场文书
爱心捐款倡议书:点燃希望,传递温暖
2019/11/04 职场文书
各国货币符号大全
2022/02/17 杂记