基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )


Posted in Javascript onNovember 14, 2010

第一种方法:

$(document).ready(function () { 
$(':input:text:first').focus(); 
$(':input:enabled').addClass('enterIndex'); 
// get only input tags with class data-entry 
textboxes = $('.enterIndex'); 
// now we check to see which browser is being used 
if ($.browser.mozilla) { 
$(textboxes).bind('keypress', CheckForEnter); 
} else { 
$(textboxes).bind('keydown', CheckForEnter); 
} 
}); 
function CheckForEnter(event) { 
if (event.keyCode == 13 && $(this).attr('type') != 'button' && $(this).attr('type') != 'submit' && $(this).attr('type') != 'textarea' && $(this).attr('type') != 'reset') { 
var i = $('.enterIndex').index($(this)); 
var n = $('.enterIndex').length; 
if (i < n - 1) { 
if ($(this).attr('type') != 'radio') 
{ 
NextDOM($('.enterIndex'),i); 
} 
else { 
var last_radio = $('.enterIndex').index($('.enterIndex[type=radio][name=' + $(this).attr('name') + ']:last')); 
NextDOM($('.enterIndex'),last_radio); 
} 
} 
return false; 
} 
} 
function NextDOM(myjQueryObjects,counter) { 
if (myjQueryObjects.eq(counter+1)[0].disabled) { 
NextDOM(myjQueryObjects, counter + 1); 
} 
else { 
myjQueryObjects.eq(counter + 1).trigger('focus'); 
} 
}

方法二(转载网络)
document.onkeydown = function(evt) { 
var isie = (document.all) ? true : false; 
var key; 
var srcobj; 
alert(isie); 
if (isie) { 
key = event.keyCode; 
srcobj = event.srcElement; 
} 
else { 
alert(evt); 
key = evt.which; 
srcobj = evt.target; 
} 
if (key == 13 && srcobj.type != 'button' && srcobj.type != 'submit' && srcobj.type != 'reset' && srcobj.type != 'textarea' && srcobj.type != '') { 
if (isie) { 
event.keyCode = 9; 
} 
else { 
var el = getNextElement(evt.target); 
if (el.type != 'hidden') 
el.focus(); 
else 
while (el.type == 'hidden') 
el = getNextElement(el); 
el.focus(); 
return false; 
} 
} 
} 
document.onkeyup = function(evt) { 
var isie = (document.all) ? true : false; 
var key; 
var srcobj; 
alert(isie); 
if (isie) { 
key = event.keyCode; 
srcobj = event.srcElement; 
} 
else { 
alert(evt); 
key = evt.which; 
srcobj = evt.target; 
} 
if (key == 13 && srcobj.type != 'button' && srcobj.type != 'submit' && srcobj.type != 'reset' && srcobj.type != 'textarea' && srcobj.type != '') { 
if (isie) { 
event.keyCode = 9; 
} 
else { 
var el = getNextElement(evt.target); 
if (el.type != 'hidden') 
el.focus(); 
else 
while (el.type == 'hidden') 
el = getNextElement(el); 
el.focus(); 
return false; 
} 
} 
} 
function getNextElement(field) { 
var form = field.form; 
for (var e = 0; e < form.elements.length; e++) { 
if (field == form.elements[e]) 
break; 
} 
return form.elements[++e % form.elements.length]; 
} function document.onkeydown() { 
var e = event.srcElement; 
if (event.keyCode == 13 && e.tagName == "INPUT" && e.type == "text") 
event.keyCode = 9; 
}
Javascript 相关文章推荐
prototype 源码中文说明之 prototype.js
Sep 22 Javascript
用javascript连接access数据库的方法
Nov 17 Javascript
js 表单验证方法(实用)
Apr 28 Javascript
js 上传图片预览问题
Dec 06 Javascript
jQuery中使用了document和window哪些属性和方法小结
Sep 13 Javascript
jQuery使用$.get()方法从服务器文件载入数据实例
Mar 25 Javascript
node网页分段渲染详解
Sep 05 Javascript
浅析Javascript的自动分号插入(ASI)机制
Sep 29 Javascript
微信小程序 require机制详解及实例代码
Dec 14 Javascript
Vue路由模块化配置的完整步骤
Aug 14 Javascript
Jquery让form表单异步提交代码实现
Nov 14 jQuery
JS图片懒加载的优点及实现原理
Jan 10 Javascript
在次封装easyui-Dialog插件实现代码
Nov 14 #Javascript
jQueryUI如何自定义组件实现代码
Nov 14 #Javascript
Jquery常用技巧收集整理篇
Nov 14 #Javascript
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
Nov 11 #Javascript
有关DOM元素与事件的3个谜题
Nov 11 #Javascript
入门基础学习 ExtJS笔记(一)
Nov 11 #Javascript
JavaScript类型转换方法及需要注意的问题小结(挺全面)
Nov 11 #Javascript
You might like
php自动适应范围的分页代码
2008/08/05 PHP
php实现处理输入转义字符的代码
2015/11/08 PHP
WordPress中调试缩略图的相关PHP函数使用解析
2016/01/07 PHP
JavaScript 异步调用框架 (Part 2 - 用例设计)
2009/08/03 Javascript
js的表单操作 简单计算器
2011/12/29 Javascript
实现只能输入数字的input不用replace方法
2013/09/12 Javascript
jquery根据锚点offset值实现动画切换
2014/09/11 Javascript
JavaScript中Date对象的常用方法示例
2015/10/24 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
2016/06/17 Javascript
jQuery+CSS3文字跑马灯特效的简单实现
2016/06/25 Javascript
简单实现Vue的observer和watcher
2016/12/21 Javascript
JavaScript登录验证基础教程
2017/11/01 Javascript
解决在vue项目中,发版之后,背景图片报错,路径不对的问题
2018/03/06 Javascript
简单了解JavaScript sort方法
2019/11/25 Javascript
微信小程序跨页面传递data数据方法解析
2019/12/13 Javascript
[01:00:35]2018DOTA2亚洲邀请赛3月30日B组 EffcetVSMineski
2018/03/31 DOTA
python使用scrapy解析js示例
2014/01/23 Python
python脚本内运行linux命令的方法
2015/07/02 Python
python用插值法绘制平滑曲线
2021/02/19 Python
在python中利用最小二乘拟合二次抛物线函数的方法
2018/12/29 Python
python代码编写计算器小程序
2020/03/30 Python
Python使用Pandas对csv文件进行数据处理的方法
2019/08/01 Python
Python生命游戏实现原理及过程解析(附源代码)
2019/08/01 Python
Python解析json代码实例解析
2019/11/25 Python
已安装tensorflow-gpu,但keras无法使用GPU加速的解决
2020/02/07 Python
python按顺序重命名文件并分类转移到各个文件夹中的实现代码
2020/07/21 Python
Pat McGrath Labs官网:世界上最有影响力的化妆师推出的彩妆品牌
2018/01/07 全球购物
NBA欧洲商店(英国):NBA Europe Store UK
2018/07/27 全球购物
智能电子秤、手表和健康监测仪:Withings(之前为诺基亚健康)
2018/10/30 全球购物
Brasty罗马尼亚:购买手表、香水、化妆品、珠宝
2020/04/21 全球购物
企业新年寄语
2014/04/04 职场文书
2014年秘书工作总结
2014/11/25 职场文书
冬季作息时间调整通知
2015/04/24 职场文书
MySQL定时备份数据库(全库备份)的实现
2021/09/25 MySQL
JMeter对MySQL数据库进行压力测试的实现步骤
2022/01/22 MySQL
Elasticsearch Recovery 详细介绍
2022/04/19 Java/Android