用JS控制回车事件的代码


Posted in Javascript onFebruary 20, 2011

我们操作习惯也确实是喜欢用回车建来直接提交数据。经过对项目的一番检查,这其实是页面设计得不好,导致浏览器在加载时把退出登录按钮当成默认的按钮,所以一按回车就触这退出按钮事件。考虑到一个庞大的项目为了这个问题去改页面设计也不太现实,况且客户要求在有“保存”按钮时按回车按钮就触发“保存”按钮事件,有“下一步”按钮时就触发它的事件,有“提交”按钮时就触发相应的事件等等,如果一个个页面去改动那工作量可就大得惊人了。于是乎考虑用直接在模板header文件中用js来实现全站对回车按钮的事件触发,下面是相应的代码:

<script language="javascript" for="document" event="onkeydown"> 
//回车按钮事件处理 
if (event.keyCode == 13){ 
event.keyCode=0; 
var list=document.getElementsByTagName("input"); 
for(var i=0;i<list.length && list[i];i++) 
{ 
if(list[i].id.indexOf("IBtnNextStep")>0){//ID中包含有“IBtnNextStep”字眼的按钮 
list[i].click(); 
} 
if(list[i].id=="BtnSave"){ 
list[i].click(); 
} if(list[i].id=="BtnSumbit"){ 
list[i].click(); 
} 
} 
return false; 
} 
</script>

其实也蛮简单的,就在模板文件中加入上面那段,先获取回车事件,然后就获取页面的所有按钮,一个个循环判断按钮ID是否符合你要求,是的就去触发按钮的事件。上面代码还存在一个问题就是当你页面中同时存在了那几个ID的按钮时,会导致触发所有按钮,至于如何改进就看实际应用场景了,而在我的项目中是不会出现同时存在这几个按钮,所以可以平安应用。
Javascript 相关文章推荐
JavaScript Event学习第二章 Event浏览器兼容性
Feb 07 Javascript
js鼠标点击按钮切换图片-图片自动切换-点击左右按钮切换特效代码
Sep 02 Javascript
JS使用cookie设置样式的方法
Jun 30 Javascript
jQuery为动态生成的select元素添加事件的方法
Aug 29 Javascript
Vue开发中整合axios的文件整理
Apr 29 Javascript
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
JS实现判断图片是否加载完成的方法分析
Jul 31 Javascript
JavaScript对象的特性与实践应用深入详解
Dec 30 Javascript
JavaScript函数式编程(Functional Programming)箭头函数(Arrow functions)用法分析
May 22 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
Feb 21 Javascript
vue-iview动态新增和删除的方法
Jun 17 Javascript
JavaScript用document.write()输出换行的示例代码
Nov 26 Javascript
apycom出品的jQuery精美菜单破解方法
Feb 18 #Javascript
自制基于jQuery的智能提示插件一枚
Feb 18 #Javascript
jQuery结合Json提交数据到Webservice,并接收从Webservice返回的Json数据
Feb 18 #Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
Feb 16 #Javascript
基于jquery的复制网页内容到WORD的实现代码
Feb 16 #Javascript
Jquery之美中不足小结
Feb 16 #Javascript
jquery的index方法实现tab效果
Feb 16 #Javascript
You might like
php str_replace的替换漏洞
2008/03/15 PHP
thinkphp普通查询与表达式查询实例分析
2014/11/24 PHP
漂亮的widgets,支持换肤和后期开发新皮肤
2007/04/23 Javascript
javascript offsetX与layerX区别
2010/03/12 Javascript
JavaScript 弹出窗体点击按钮返回选择数据的实现
2010/04/01 Javascript
jquery ajax提交整个表单元素的快捷办法
2013/03/27 Javascript
jsp js鼠标移动到指定区域显示选项卡离开时隐藏示例
2013/06/14 Javascript
Javscript删除数组中指定元素并返回新数组
2014/03/06 Javascript
javascript 3d 逐侦产品展示(核心精简)
2014/03/26 Javascript
JQuery给网页更换皮肤的方法
2015/05/30 Javascript
使用Bootstrap框架制作查询页面的界面实例代码
2016/05/27 Javascript
完美JQuery图片切换效果的简单实现
2016/07/21 Javascript
jQuery+css实现非常漂亮的水平导航菜单效果
2016/07/27 Javascript
jQuery Validate表单验证插件的基本使用方法及功能拓展
2017/01/04 Javascript
jQuery对table表格进行增删改查
2020/12/22 Javascript
jQuery Datatable 多个查询条件自定义提交事件(推荐)
2017/08/24 jQuery
AngularJs分页插件使用详解
2018/06/30 Javascript
JavaScript实现简单的计算器
2020/01/16 Javascript
Python爬取国外天气预报网站的方法
2015/07/10 Python
分享几道你可能遇到的python面试题
2017/07/24 Python
Python3 中文文件读写方法
2018/01/23 Python
Python+OpenCV+pyQt5录制双目摄像头视频的实例
2019/06/28 Python
python禁用键鼠与提权代码实例
2019/08/16 Python
Python数据可视化处理库PyEcharts柱状图,饼图,线性图,词云图常用实例详解
2020/02/10 Python
python+selenium 脚本实现每天自动登记的思路详解
2020/03/11 Python
美国电子元器件分销商:Newark element14
2018/01/13 全球购物
与世界上最好的跑步专业品牌合作:Fleet Feet
2019/03/22 全球购物
电气专业推荐信范文
2013/11/18 职场文书
中学生打架检讨书
2014/02/10 职场文书
幼儿园课题实施方案
2014/05/14 职场文书
施工质量承诺书范文
2014/05/30 职场文书
资源环境与城乡规划管理专业自荐书
2014/09/26 职场文书
党员带头倡议书
2015/04/29 职场文书
活着观后感
2015/06/03 职场文书
社区宣传标语口号
2015/12/26 职场文书
mysql备份策略的实现(全量备份+增量备份)
2021/07/07 MySQL