用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 相关文章推荐
可输入的下拉框
Jun 19 Javascript
input、button的不同type值在ajax提交表单时导致的陷阱
Feb 24 Javascript
jquery下为Event handler传递动态参数的代码
Jan 06 Javascript
js创建表单元素并使用submit进行提交
Aug 14 Javascript
高性能JavaScript 重排与重绘(2)
Aug 11 Javascript
javascript中this关键字详解
Dec 12 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
jQuery实现动态文字搜索功能
Jan 05 Javascript
详解JavaScript中的六种错误类型
Sep 21 Javascript
在vue 中使用 less的教程详解
Sep 26 Javascript
微信小程序实现购物页面左右联动
Feb 15 Javascript
微信小程序通过websocket实时语音识别的实现代码
Aug 19 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 实现进制转换(二进制、八进制、十六进制)互相转换实现代码
2010/10/22 PHP
[原创]PHP简单开启curl的方法(测试可行)
2016/01/11 PHP
php的闭包(Closure)匿名函数初探
2016/02/14 PHP
Laravel框架实现的上传图片到七牛功能详解
2019/09/06 PHP
用apply让javascript函数仅执行一次的代码
2010/06/27 Javascript
JavaScript中数组的排序、乱序和搜索实现代码
2011/11/30 Javascript
Javascript实现DIV滚动自动滚动到底部的代码
2012/03/01 Javascript
中止javascript执行的方法
2014/02/14 Javascript
兼容主流浏览器的jQuery+CSS 实现遮罩层的简单代码
2014/10/14 Javascript
原生javascript实现获取指定元素下所有后代元素的方法
2014/10/28 Javascript
Node.js 异步编程之 Callback介绍(一)
2015/03/30 Javascript
JQuery中DOM实现事件移除的方法
2015/06/13 Javascript
js实现仿网易点击弹出提示同时背景变暗效果
2015/08/13 Javascript
vue如何将v-for中的表格导出来
2018/05/07 Javascript
微信网页授权并获取用户信息的方法
2018/07/30 Javascript
AngularJS实现与后台服务器进行交互的示例讲解
2018/08/13 Javascript
JS实现选项卡效果的代码实例
2019/05/20 Javascript
详解在React-Native中持久化redux数据
2019/05/22 Javascript
vue input标签通用指令校验的实现
2019/11/05 Javascript
js数据类型转换与流程控制操作实例分析
2019/12/18 Javascript
浅谈Vue.use到底是什么鬼
2020/01/21 Javascript
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
2020/08/20 Javascript
python基于queue和threading实现多线程下载实例
2014/10/08 Python
在Python中处理字符串之isdigit()方法的使用
2015/05/18 Python
pandas中的DataFrame按指定顺序输出所有列的方法
2018/04/10 Python
python 读取文件并把矩阵转成numpy的两种方法
2019/02/12 Python
Python使用pyserial进行串口通信的实例
2019/07/02 Python
python3.6+django2.0+mysql搭建网站过程详解
2019/07/24 Python
浅谈keras.callbacks设置模型保存策略
2020/06/18 Python
Woods官网:加拿大最古老、最受尊敬的户外品牌之一
2020/09/12 全球购物
食品质量与安全专业毕业生求职信
2014/08/11 职场文书
个人先进材料范文
2014/12/30 职场文书
会计试用期工作总结2015
2015/05/28 职场文书
运动会通讯稿200字
2015/07/20 职场文书
敬老院活动感想
2015/08/07 职场文书
详解PHP服务器如何在有限的资源里最大提升并发能力
2021/05/25 PHP