用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 相关文章推荐
js 替换
Feb 19 Javascript
妙用Jquery的val()方法
Jun 27 Javascript
特殊情况下如何获取span里面的值
May 20 Javascript
深入理解JavaScript系列(22):S.O.L.I.D五大原则之依赖倒置原则DIP详解
Mar 05 Javascript
Python脚本后台运行的几种方式
Mar 09 Javascript
js实现跨域访问的三种方法
Dec 09 Javascript
简单了解JavaScript操作XPath的一些基本方法
Jun 03 Javascript
Bootstrap基本插件学习笔记之标签切换(17)
Dec 08 Javascript
详解a++和++a的区别
Aug 30 Javascript
vue删除html内容的标签样式实例
Sep 13 Javascript
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
element中Steps步骤条和Tabs标签页关联的解决
Dec 08 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
关于WordPress的SEO优化相关的一些PHP页面脚本技巧
2015/12/10 PHP
使用jquery自定义鼠标样式满足个性需求
2013/11/05 Javascript
javascript生成随机大小写字母的方法
2014/02/20 Javascript
nodejs中实现路由功能
2014/12/29 NodeJs
Javascript基础教程之变量
2015/01/18 Javascript
JS实现带有抽屉效果的产品类网站多级导航菜单代码
2015/09/15 Javascript
详解javascript立即执行函数表达式IIFE
2017/02/13 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
原生JS实现Ajax跨域请求flask响应内容
2017/10/24 Javascript
Auto.js自动收取自己和好友蚂蚁森林能量脚本
2018/06/28 Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
2018/10/18 Javascript
利用Python的Twisted框架实现webshell密码扫描器的教程
2015/04/16 Python
Python脚本暴力破解栅栏密码
2015/10/19 Python
python中set()函数简介及实例解析
2018/01/09 Python
python实现简单遗传算法
2018/03/19 Python
python删除字符串中指定字符的方法
2018/08/13 Python
opencv转换颜色空间更改图片背景
2019/08/20 Python
Python 读取WAV音频文件 画频谱的实例
2020/03/14 Python
Python字符串格式化f-string多种功能实现
2020/05/07 Python
python操作链表的示例代码
2020/09/27 Python
python+selenium+chrome实现淘宝购物车秒杀自动结算
2021/01/07 Python
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
马来西亚网上购物:Youbeli
2018/03/30 全球购物
英国最大的宝石首饰超市:QP Jewellers
2018/09/23 全球购物
关于递归的一道.NET面试题
2013/05/12 面试题
升职自荐信范文
2013/10/05 职场文书
商场中秋节活动方案
2014/02/07 职场文书
小学端午节活动方案
2014/03/13 职场文书
产品质量保证书
2014/04/29 职场文书
工程合作意向书范本
2015/05/09 职场文书
千手观音观后感
2015/06/03 职场文书
Python list去重且保持原顺序不变的方法
2021/04/03 Python
CentOS7和8下安装Maven3.8.4
2022/04/07 Servers
Mysql索引失效 数据库表中有索引还是查询很慢
2022/05/15 MySQL
python数字图像处理数据类型及颜色空间转换
2022/06/28 Python
el-form每行显示两列底部按钮居中效果的实现
2022/08/05 HTML / CSS