用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 相关文章推荐
根据分辨率不同,调用不同的css文件
Aug 25 Javascript
JavaScript日期时间格式化函数分享
May 05 Javascript
浏览器缩放检测的js代码
Sep 28 Javascript
JavaScript实现简单获取当前网页网址的方法
Nov 09 Javascript
JS鼠标拖拽实例分析
Nov 23 Javascript
javascript中对Date类型的常用操作小结
May 19 Javascript
解决JS外部文件中文注释出现乱码问题
Jul 09 Javascript
利用JQUERY实现多个AJAX请求等待的实例
Dec 14 jQuery
vue 实现全选全不选的示例代码
Mar 29 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
Nov 30 Javascript
微信小程序实现星级评价
Nov 20 Javascript
微信小程序实现简单文字跑马灯
May 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获取当前文件所在目录 getcwd()函数
2009/05/13 PHP
PHP中nowdoc和heredoc使用需要注意的一点
2014/03/21 PHP
smarty半小时快速上手入门教程
2014/10/27 PHP
PHP CodeIgniter框架的工作原理研究
2015/03/30 PHP
Laravel框架实现定时Task Scheduling例子
2019/10/22 PHP
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
2011/05/07 Javascript
20个实用的JavaScript技巧分享
2014/11/28 Javascript
js对象的复制继承实例
2015/01/10 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
2015/07/29 Javascript
详解JavaScript中的自定义事件编写
2016/05/10 Javascript
jQuery页面弹出框实现文件上传
2017/02/09 Javascript
js replace()去除代码中空格的实例
2017/02/14 Javascript
JS实现根据密码长度显示安全条功能
2017/03/08 Javascript
React Native第三方平台分享的实例(Android,IOS双平台)
2017/08/04 Javascript
jQuery:unbind方法的使用详解
2017/08/14 jQuery
详述 Sublime Text 打开 GBK 格式中文乱码的解决方法
2017/10/26 Javascript
p5.js入门教程之图片加载
2018/03/20 Javascript
JavaScript选择排序算法原理与实现方法示例
2018/08/06 Javascript
vue(2.x,3.0)配置跨域代理
2019/11/27 Javascript
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能
2020/03/07 Javascript
vue 在methods中调用mounted的实现操作
2020/08/07 Javascript
jQuery实现异步上传一个或多个文件
2020/08/17 jQuery
[54:27]TNC vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
以Python的Pyspider为例剖析搜索引擎的网络爬虫实现方法
2015/03/30 Python
举例讲解Python中装饰器的用法
2015/04/27 Python
Python requests库用法实例详解
2018/08/14 Python
python+openCV利用摄像头实现人员活动检测
2019/06/22 Python
Python模拟登录之滑块验证码的破解(实例代码)
2019/11/18 Python
通过实例解析python subprocess模块原理及用法
2020/10/10 Python
tensorflow与numpy的版本兼容性问题的解决
2021/01/08 Python
美津浓美国官网:Mizuno美国
2018/08/07 全球购物
J2EE是技术还是平台还是框架
2016/08/14 面试题
公司前台接待岗位职责
2013/12/03 职场文书
《小壁虎借尾巴》教学反思
2014/02/16 职场文书
法制宣传口号
2014/06/16 职场文书
2014年药品销售工作总结
2014/12/16 职场文书