按下Enter焦点移至下一个控件的实现js代码


Posted in Javascript onDecember 11, 2013
<html> 
<head> 
<title>Enter2Tab</title> 
<script type="text/javascript"> 
window.onload=function(){ 
var list = new Array(); 
for(var i=5;i<document.all.length;i++) 
{ 
if(document.all[i].type=="text"||document.all[i].tagName=="SELECT") 
list.push(i); 
} for(var i=0;i<list.length-1;i++) 
{ 
document.all[list[i]].setAttribute("nextFocusIndex",list[i+1]); 
document.all[list[i]].onkeydown=JumpToNext; 
} 
for(var i=list.length-1;i<document.all.length;i++) 
{ 
if(document.all[i].type=="button") 
{ 
document.all[list[list.length-1]].setAttribute("nextFocusIndex",i); 
document.all[list[list.length-1]].onkeydown=JumpToNext; 
break; 
} 
} 
document.all[list[0]].focus(); 
} 
function JumpToNext(){ 
if(event.keyCode==13) 
{ 
var nextFocusIndex=this.getAttribute("nextFocusIndex"); 
document.all[nextFocusIndex].focus(); 
} 
} 
</script> 
</head> 
<body> 
<input id="A" name="A" type="text" /> 
<input id="B" name="B" type="text" /> 
<input id="C" name="C" type="text" /> 
<input id="D" name="D" type="text" /> 
<input id="E" name="E" type="text" /> 
<select id="S1" name="S1"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
<option>4</option> 
<option>5</option> 
</select> 
<select id="S2" name="S2"> 
<option>1</option> 
<option>2</option> 
<option>3</option> 
<option>4</option>
Javascript 相关文章推荐
JavaScript 使用技巧精萃(.net html
Apr 25 Javascript
JavaScript 题型问答有答案参考
Feb 17 Javascript
JS实现表单中checkbox对勾选中增加边框显示效果
Aug 21 Javascript
JavaScript组件开发完整示例
Dec 15 Javascript
js+css实现select的美化效果
Mar 24 Javascript
jquery 获取select数组与name数组长度的实现代码
Jun 20 Javascript
JS中Json数据的处理和解析JSON数据的方法详解
Jun 29 Javascript
简单实现JavaScript图片切换效果
Nov 28 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
使用Typescript和ES模块发布Node模块的方法
May 25 Javascript
JS 4个超级实用的小技巧 提升开发效率
Oct 05 Javascript
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
Apr 06 Vue.js
JS中window.open全屏命令解析及使用示例
Dec 11 #Javascript
js的匿名函数使用介绍
Dec 11 #Javascript
jquery ajax jsonp跨域调用实例代码
Dec 11 #Javascript
JavaScript Math.ceil() 函数使用介绍
Dec 11 #Javascript
Javascript实现返回上一页面并刷新的小例子
Dec 11 #Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
Dec 11 #Javascript
判断javascript的数据类型(示例代码)
Dec 11 #Javascript
You might like
PHP5新特性: 更加面向对象化的PHP
2006/11/18 PHP
PHP 加密与解密的斗争
2009/04/17 PHP
PHP针对字符串开头和结尾的判断方法
2016/07/11 PHP
Laravel中前端js上传图片到七牛云的示例代码
2017/09/04 PHP
PHP的PDO事务与自动提交
2019/01/24 PHP
JavaScript和ActionScript的交互实现代码
2010/08/01 Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
jquery实现input输入框实时输入触发事件代码
2014/01/28 Javascript
js动态切换图片的方法
2015/01/20 Javascript
js实现同一页面多个运动效果的方法
2015/04/10 Javascript
javascript元素动态创建实现方法
2015/05/13 Javascript
jQuery插件开发精品教程(让你的jQuery更上一个台阶)
2015/11/07 Javascript
js 提交form表单和设置form表单请求路径的实现方法
2016/10/25 Javascript
基于javascript实现的购物商城商品倒计时实例
2016/12/11 Javascript
JavaScript使用atan2来绘制箭头和曲线的实例
2017/09/14 Javascript
详解vue 计算属性与方法跟侦听器区别(面试考点)
2018/04/23 Javascript
小程序如何支持使用 async/await详解
2019/09/12 Javascript
JQuery基于FormData异步提交数据文件
2020/09/01 jQuery
Python中使用 Selenium 实现网页截图实例
2014/07/18 Python
Python正则表达式经典入门教程
2017/05/22 Python
详解python:time模块用法
2019/03/25 Python
一行Python代码制作动态二维码的实现
2019/09/09 Python
学习Django知识点分享
2019/09/11 Python
html5实现多图片预览上传及点击可拖拽控件
2018/03/15 HTML / CSS
西班牙最大的在线滑板和街头服饰商店:Fillow.net
2019/04/15 全球购物
Visual-Click葡萄牙:欧洲领先的在线眼镜商
2020/02/17 全球购物
分别介绍一下Session Bean和Entity Bean
2015/03/13 面试题
拓展培训心得体会
2014/01/04 职场文书
市优秀教师事迹材料
2014/02/05 职场文书
环保公益广告语
2014/03/13 职场文书
2014年最新个人对照检查材料范文
2014/09/25 职场文书
党员群众路线自我剖析材料
2014/10/06 职场文书
幼儿园重阳节活动总结
2015/05/05 职场文书
当幸福来敲门英文观后感
2015/06/01 职场文书
证婚人婚礼致辞
2015/07/28 职场文书
Apache Kafka 分区重分配的实现原理解析
2022/07/15 Servers