基于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 相关文章推荐
artdialog的图片/标题以及关闭按钮不显示的解决方法
Jun 27 Javascript
extjs render 用法介绍
Sep 11 Javascript
web css实现整站样式互相切换
Oct 29 Javascript
JS中表单的使用小结
Jan 11 Javascript
js写出遮罩层登陆框和对联广告并自动跟随滚动条滚动
Apr 29 Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
Nov 13 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
Sep 05 Javascript
js实现rem自动匹配计算font-size的示例
Nov 18 Javascript
vue中axios解决跨域问题和拦截器的使用方法
Mar 07 Javascript
JS实现的JSON数组去重算法示例
Apr 11 Javascript
vue.js中使用echarts实现数据动态刷新功能
Apr 16 Javascript
Vue 实现显示/隐藏层的思路(加全局点击事件)
Dec 31 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 格式化数字的时候注意数字的范围
2010/04/13 PHP
PHP 5.3.1 安装包 VC9 VC6不同版本的区别是什么
2010/07/04 PHP
php入门学习知识点二 PHP简单的分页过程与原理
2011/07/14 PHP
PHP Cookei记录用户历史浏览信息的代码
2016/02/03 PHP
JS加ASP二级域名转向的代码
2007/05/17 Javascript
动态表格Table类的实现
2009/08/26 Javascript
Javascript 获取链接(url)参数的方法[正则与截取字符串]
2010/02/09 Javascript
JavaScript去掉数组中的重复元素
2011/01/13 Javascript
NodeJS框架Express的模板视图机制分析
2011/07/19 NodeJs
Jquery动态更改一张位图的src与Attr的使用
2013/07/31 Javascript
Window.Open如何在同一个标签页打开
2014/06/20 Javascript
通俗易懂地解释JS中的闭包
2017/10/23 Javascript
vue-cli 首屏加载优化问题
2018/11/06 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
jQuery实现的移动端图片缩放功能组件示例
2020/05/01 jQuery
ant-design-vue按需加载的坑的解决
2020/05/14 Javascript
Openlayers实现点闪烁扩散效果
2020/09/24 Javascript
手写Vue2.0 数据劫持的示例
2021/03/04 Vue.js
python实现在字符串中查找子字符串的方法
2015/07/11 Python
Python subprocess模块详细解读
2018/01/29 Python
python腾讯语音合成实现过程解析
2019/08/01 Python
python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法
2020/02/26 Python
解决Keras TensorFlow 混编中 trainable=False设置无效问题
2020/06/28 Python
Python如何绘制日历图和热力图
2020/08/07 Python
Python 按比例获取样本数据或执行任务的实现代码
2020/12/03 Python
python利用opencv实现颜色检测
2021/02/23 Python
Parfumdreams英国:香水和化妆品
2019/05/10 全球购物
一套比较完整的软件测试人员面试题
2012/05/13 面试题
个人自荐材料
2014/05/23 职场文书
证婚人致辞精选
2015/07/28 职场文书
关于开学的感想
2015/08/10 职场文书
2016年优秀少先队辅导员事迹材料
2016/02/26 职场文书
导游词之介休绵山
2019/12/31 职场文书
Jupyter notebook 输出部分显示不全的解决方案
2021/04/24 Python
redis实现的四种常见限流策略
2021/06/18 Redis
详细了解MVC+proxy
2021/07/09 Java/Android