Javascript中自动切换焦点实现代码


Posted in Javascript onDecember 15, 2012
<!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"); 
EventUtil.addhandler(textTel1,"keyup",tabForward); 
EventUtil.addhandler(textTel2,"keyup",tabForward); 
EventUtil.addhandler(textTel3,"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" /> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
jquery获得下拉框值的代码
Aug 13 Javascript
EasyUI中的tree用法介绍
Nov 01 Javascript
js图片处理示例代码
May 12 Javascript
JavaScript计算两个日期时间段内日期的方法
Mar 16 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
Jan 18 Javascript
js仿3366小游戏选字游戏
Apr 14 Javascript
node.js 利用流实现读写同步,边读边写的方法
Sep 11 Javascript
vue js秒转天数小时分钟秒的实例代码
Aug 08 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
Feb 22 Javascript
JS算法题之查找数字在数组中的索引位置
May 15 Javascript
vue组件三大核心概念图文详解
May 30 Javascript
js实现掷骰子小游戏
Oct 24 Javascript
treepanel动态加载数据实现代码
Dec 15 #Javascript
FF火狐下获取一个元素同类型的相邻元素实现代码
Dec 15 #Javascript
javascript错误的认识不用关心内存管理
Dec 15 #Javascript
jQuery 选择表格(table)里的行和列及改变简单样式
Dec 15 #Javascript
Jquery 选中表格一列并对表格排序实现原理
Dec 15 #Javascript
js 操作select和option常用代码整理
Dec 13 #Javascript
JavaScript 产生不重复的随机数三种实现思路
Dec 13 #Javascript
You might like
php 中英文语言转换类代码
2011/08/11 PHP
微信支付开发教程(一)微信支付URL配置
2014/05/28 PHP
PHP实现的QQ空间g_tk加密算法
2015/07/09 PHP
tp5.1 框架数据库常见操作详解【添加、删除、更新、查询】
2020/05/26 PHP
js innerHTML 的一些问题的解决方法
2008/06/22 Javascript
JQuery实现绚丽的横向下拉菜单
2013/12/19 Javascript
jQuery源码分析之Callbacks详解
2015/03/13 Javascript
JS实现浏览器状态栏文字从右向左弹出效果代码
2015/10/27 Javascript
js 右侧浮动层效果实现代码(跟随滚动)
2015/11/22 Javascript
Javascript基础之数组的使用
2016/05/13 Javascript
jQuery获取访问者IP地址的方法(基于新浪API与QQ查询接口)
2016/05/25 Javascript
微信小程序 如何引入外部字体库iconfont的图标
2018/01/31 Javascript
解决使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js问题
2018/08/30 Javascript
在Vue-cli里应用Vuex的state和mutations方法
2018/09/16 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
2018/12/06 Javascript
Vue实现数据表格合并列rowspan效果
2020/11/30 Javascript
Egg Vue SSR 服务端渲染数据请求与asyncData
2019/11/24 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
Vue中ref和$refs的介绍以及使用方法示例
2021/01/11 Vue.js
[41:11]完美世界DOTA2联赛PWL S2 Inki vs Magma 第一场 11.22
2020/11/24 DOTA
python实现解数独程序代码
2017/04/12 Python
快速解决安装python没有scripts文件夹的问题
2018/04/03 Python
python中copy()与deepcopy()的区别小结
2018/08/03 Python
python 动态生成变量名以及动态获取变量的变量名方法
2019/01/20 Python
Python Django 页面上展示固定的页码数实现代码
2019/08/21 Python
scikit-learn线性回归,多元回归,多项式回归的实现
2019/08/29 Python
NumPy统计函数的实现方法
2020/01/21 Python
python字典通过值反查键的实现(简洁写法)
2020/09/30 Python
50岁生日感言
2014/01/23 职场文书
小学英语课后反思
2014/04/26 职场文书
竞聘报告优秀范文
2014/11/06 职场文书
2014年计划生育协会工作总结
2014/11/14 职场文书
劳动者解除劳动合同通知书
2015/04/16 职场文书
高中政治教学反思
2016/02/23 职场文书
SONY AN-LP1 短波有源天线放大器
2021/04/22 无线电
详解如何使用Nginx解决跨域问题
2022/05/06 Servers