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 相关文章推荐
javascript 图片上传预览-兼容标准
Jun 01 Javascript
asp(javascript)全角半角转换代码 dbc2sbc
Aug 06 Javascript
javascript 手动给表增加数据的小例子
Jul 10 Javascript
javascript从右边截取指定字符串的三种实现方法
Nov 29 Javascript
js动态添加表格数据使用insertRow和insertCell实现
May 22 Javascript
JavaScript中的small()方法使用详解
Jun 08 Javascript
HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果(附demo源码下载)
May 25 Javascript
angularjs 源码解析之scope
Aug 22 Javascript
jQuery在header中设置请求信息的方法
Mar 06 Javascript
angularjs实现天气预报功能
Jun 16 Javascript
详解javascript设计模式三:代理模式
Mar 25 Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
Sep 17 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处理json格式数据经典案例总结
2016/05/19 PHP
Yii2.0框架behaviors方法使用实例分析
2019/09/30 PHP
JQUERY复选框CHECKBOX全选,取消全选
2008/08/30 Javascript
js 程序执行与顺序实现详解
2013/05/13 Javascript
node.js中的fs.utimesSync方法使用说明
2014/12/15 Javascript
jquery实现可拖拽弹出层特效
2015/01/04 Javascript
BootStrap中的table实现数据填充与分页应用小结
2016/05/26 Javascript
jQuery实现的瀑布流加载效果示例
2016/09/13 Javascript
JS实现中国公民身份证号码有效性验证
2017/02/20 Javascript
微信小程序富文本渲染引擎的详解
2017/09/30 Javascript
自定义Vue中的v-module双向绑定的实现
2019/04/17 Javascript
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
原生js实现日期选择插件
2020/05/21 Javascript
基于element-ui封装表单金额输入框的方法示例
2021/01/06 Javascript
[03:00]2018完美盛典_最佳英雄奖
2018/12/17 DOTA
Python实现扫描指定目录下的子目录及文件的方法
2014/07/16 Python
Linux中Python 环境软件包安装步骤
2016/03/31 Python
python中嵌套函数的实操步骤
2019/02/27 Python
python中pip的使用和修改下载源的方法
2019/07/08 Python
python 检查数据中是否有缺失值,删除缺失值的方式
2019/12/02 Python
浅谈Django前端后端值传递问题
2020/07/15 Python
Python 爬取淘宝商品信息栏目的实现
2021/02/06 Python
css3实现文字扫光渐变动画效果的示例
2017/11/07 HTML / CSS
巴西购物网站:Submarino
2020/01/19 全球购物
华为菲律宾官方网站:HUAWEI Philippines
2021/02/23 全球购物
初二生物教学反思
2014/02/03 职场文书
内刊编辑求职自荐书范文
2014/02/19 职场文书
餐饮营销方案
2014/02/23 职场文书
学生评语大全
2014/04/18 职场文书
爱国口号
2014/06/19 职场文书
社区综治宣传月活动总结
2014/07/02 职场文书
拾金不昧表扬信怎么写
2015/05/04 职场文书
2015年共青团工作总结
2015/05/15 职场文书
2016大学军训通讯稿
2015/11/25 职场文书
Python实现机器学习算法的分类
2021/06/03 Python
基于CSS制作创意端午节专属加载特效
2022/06/01 HTML / CSS