基于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 相关文章推荐
基于jquery的分页控件(C#)
Jan 06 Javascript
Extjs NumberField后面加单位实现思路
Jul 30 Javascript
使用jQuery插件创建常规模态窗口登陆效果
Aug 23 Javascript
JavaScript中判断原生函数检查function是否是原生代码
Sep 09 Javascript
微信小程序 高德地图SDK详解及简单实例(源码下载)
Jan 11 Javascript
前端分页功能的实现以及原理(jQuery)
Jan 22 Javascript
Vue自定义指令拖拽功能示例
Feb 17 Javascript
web.js.字符串与正则表达式操作
May 13 Javascript
react.js 父子组件数据绑定实时通讯的示例代码
Sep 25 Javascript
node puppeteer(headless chrome)实现网站登录
May 09 Javascript
vue 循环加载数据并获取第一条记录的方法
Sep 26 Javascript
微信小程序保存图片到相册权限设置
Apr 09 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程序?
2006/12/08 PHP
PHP 文件缓存的性能测试
2010/04/25 PHP
Codeigniter上传图片出现“You did not select a file to upload”错误解决办法
2014/06/12 PHP
PHP遍历文件夹与文件类及处理类用法实例
2014/09/23 PHP
php中header跳转使用include包含解决参数丢失问题
2015/05/08 PHP
js事件(Event)知识整理
2012/10/11 Javascript
ionic实现滑动的三种方式
2016/08/27 Javascript
jQuery实现的导航下拉菜单效果示例
2016/09/05 Javascript
js获取时间函数及扩展函数的方法
2016/10/30 Javascript
js实现砖头在页面拖拉效果
2020/11/20 Javascript
JavaScript中的工厂函数(推荐)
2017/03/08 Javascript
js 发布订阅模式的实例讲解
2017/09/10 Javascript
AngularJS中的路由使用及实现代码
2017/10/09 Javascript
js实现图片粘贴上传到服务器并展示的实例
2017/11/08 Javascript
微信小程序实现刷脸登录
2018/05/25 Javascript
深入了解JavaScript词法作用域
2020/07/29 Javascript
详解Python如何获取列表(List)的中位数
2016/08/12 Python
Python单例模式实例详解
2017/03/01 Python
Django使用paginator插件实现翻页功能的实例
2018/10/24 Python
python实现汽车管理系统
2018/11/30 Python
pandas DataFrame 交集并集补集的实现
2019/06/24 Python
PyTorch中常用的激活函数的方法示例
2019/08/20 Python
Python操作Sonqube API获取检测结果并打印过程解析
2019/11/27 Python
python列表返回重复数据的下标
2020/02/10 Python
在Mac中PyCharm配置python Anaconda环境过程图解
2020/03/11 Python
Python基于paramunittest模块实现excl参数化
2020/04/26 Python
Python读取多列数据以及用matplotlib制作图表方法实例
2020/09/23 Python
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
编写用C语言实现的求n阶阶乘问题的递归算法
2014/10/21 面试题
大学生职业生涯规划书模板
2014/01/03 职场文书
校园创业策划书
2014/01/14 职场文书
学生安全承诺书
2014/05/22 职场文书
2014社区健康教育工作总结
2014/12/16 职场文书
感恩教师主题班会
2015/08/12 职场文书
2016入党积极分子党课学习心得体会
2015/10/09 职场文书
感恩信:写给爸爸妈妈的一封感谢信
2019/09/12 职场文书