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 相关文章推荐
控制打印时页眉角的代码
Feb 08 Javascript
javascript写的一个模拟阅读小说的程序
Apr 04 Javascript
改变状态栏文字的js代码
Jun 13 Javascript
JavaScript中的函数重载深入理解
Aug 04 Javascript
Javascript基础教程之while语句
Jan 18 Javascript
jQuery插件ajaxfileupload.js实现上传文件
Oct 23 Javascript
pc加载更多功能和移动端下拉刷新加载数据
Nov 07 Javascript
JavaScript中的子窗口与父窗口的互相调用问题
Feb 08 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
Jun 01 Javascript
基于jQuery封装的分页组件
Jun 26 jQuery
vue中路由跳转不计入history的操作
Sep 21 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 ci 获取表单中多个同名input元素值的代码
2016/03/25 PHP
PHP数组函数array_multisort()用法实例分析
2016/04/02 PHP
workerman结合laravel开发在线聊天应用的示例代码
2018/10/30 PHP
php传值和传引用的区别点总结
2019/11/19 PHP
浅谈php常用的7大框架的优缺点
2020/07/20 PHP
Mootools 1.2教程 定时器和哈希简介
2009/09/15 Javascript
ie支持function.bind()方法实现代码
2012/12/27 Javascript
生成二维码方法汇总
2014/12/26 Javascript
JS/jQ实现免费获取手机验证码倒计时效果
2016/06/13 Javascript
轻松5句话解决JavaScript的作用域
2016/07/15 Javascript
React Native中Navigator的使用方法示例
2017/10/13 Javascript
webpack 插件html-webpack-plugin的具体使用
2018/04/09 Javascript
JavaScript+H5实现微信摇一摇功能
2018/05/23 Javascript
nodejs实现一个word文档解析器思路详解
2018/08/14 NodeJs
node中的密码安全(加密)
2018/09/17 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
2018/09/18 Javascript
微信小程序实现列表页的点赞和取消点赞功能
2018/11/02 Javascript
JS实现获取数组中最大值或最小值功能示例
2019/03/02 Javascript
JavaScript日期库date-fn.js使用方法解析
2020/09/09 Javascript
[03:52]DOTA2英雄基础教程 酒仙
2013/12/23 DOTA
如何在VSCode上轻松舒适的配置Python的方法步骤
2019/10/28 Python
python matplotlib包图像配色方案分享
2020/03/14 Python
Answear匈牙利:来自全球200多个知名时尚品牌
2017/04/21 全球购物
橄榄树药房:OLIVEDA
2019/09/01 全球购物
医院辞职信范文
2014/01/17 职场文书
2014新年寄语
2014/01/20 职场文书
教师简历自我评价
2014/02/03 职场文书
幼儿园小班教师寄语
2014/04/03 职场文书
志愿者活动总结报告
2014/06/27 职场文书
优秀团支部申报材料
2014/12/26 职场文书
个人委托函范文
2015/01/29 职场文书
赞助商致辞
2015/07/30 职场文书
观看《筑梦中国》纪录片心得体会
2016/01/18 职场文书
WordPress多语言翻译插件 - WPML使用教程
2021/04/01 PHP
七个非常实用的Python工具包总结
2021/06/15 Python
SpringBoot连接MySQL获取数据写后端接口的操作方法
2021/11/02 MySQL