jQuery响应enter键的实现思路


Posted in Javascript onApril 18, 2014

有时候我们有这样的需求:当用户在表单里数据完数据后,之间按enter键就可以执行查询或者保存的操作。实现的思路如下。

让你的form表单或需要响应enter键的区域处于div之间。形如:

<div class="top_inputbox"> 单位名称:<input class="inp" type="text" name="qureyBean.com_name" 
value="${qureyBean.com_name}" /> 
<a href="javascript:firstPage();">查询</a> 
</div>

响应键盘enter键的js:
$(".top_inputbox").keypress(function (e){ 
var code = event.keyCode; 
if (13 == code) { 
alert("响应键盘的enter事件"); 
} 
});

这样你就可以alert做你想做的操作了。

公司目前用的是这样的响应:

//回车快捷查询 
$(".top_inputbox").keypress(function (e) { 
var keyCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode; 
if (keyCode == 13){ 
alert("响应键盘的enter事件"); 
} 
});

我在网上搜了一下,e.keyCode ? e.keyCode : e.which ? e.which : e.charCode 这是为了兼容性。
Javascript 相关文章推荐
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 Javascript
FF IE兼容性的修改小结
Sep 02 Javascript
js 获取input点选按钮的值的方法
Apr 14 Javascript
jQuery 仿百度输入标签插件附效果图
Jul 04 Javascript
创建自己的jquery表格插件
Nov 25 Javascript
jQuery回到顶部的代码
Jul 09 Javascript
BootStrap tooltip提示框使用小结
Oct 26 Javascript
ThinkJS中如何使用MongoDB的CURD操作
Dec 13 Javascript
Vue.JS项目中5个经典Vuex插件
Nov 28 Javascript
解析vue路由异步组件和懒加载案例
Jun 08 Javascript
微信打开网址添加在浏览器中打开提示的办法
May 20 Javascript
基于jquery实现彩色投票进度条代码解析
Aug 26 jQuery
jquery easyui 结合jsp简单展现table数据示例
Apr 18 #Javascript
jQuery如何取id有.的值一般的方法是取不到的
Apr 18 #Javascript
用jquery仿做发微博功能示例
Apr 18 #Javascript
实例说明为什么不要行内使用javascript
Apr 18 #Javascript
自制的文件上传JS控件可支持IE、chrome、firefox etc
Apr 18 #Javascript
禁用Tab键JS代码兼容Firefox和IE
Apr 18 #Javascript
JQuery each()嵌套使用小结
Apr 18 #Javascript
You might like
体育彩票排列三组选三算法分享
2014/03/07 PHP
Opcache导致php-fpm崩溃nginx返回502
2015/03/02 PHP
PHP示例演示发送邮件给某个邮箱
2019/04/03 PHP
图片在浏览器中底部对齐 解决方法之一
2011/11/30 Javascript
jquery.post用法关于type设置问题补充
2014/01/03 Javascript
js利用事件的阻止冒泡实现点击空白模态框的隐藏
2014/01/24 Javascript
javascript 自定义回调函数示例代码
2014/09/26 Javascript
Javascript学习笔记之数组的构造函数
2014/11/23 Javascript
jQuery中click事件用法实例
2014/12/26 Javascript
jQuery圆形统计图开发实例
2015/01/04 Javascript
jQuery实现的经典竖向伸缩菜单效果代码
2015/09/24 Javascript
基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法
2016/05/10 Javascript
jQuery 获取屏幕高度、宽度的简单实现案例
2016/05/17 Javascript
BootStrap表单时间选择器详解
2017/05/09 Javascript
layui文件上传实现代码
2017/05/20 Javascript
Angular实现类似博客评论的递归显示及获取回复评论的数据
2017/11/06 Javascript
详解VUE-地区选择器(V-Distpicker)组件使用心得
2018/05/07 Javascript
ionic grid(栅格)九宫格制作详解
2018/06/30 Javascript
vuejs+element UI点击编辑表格某一行时获取内容填入表单的示例
2018/10/31 Javascript
微信小程序如何使用globalData的方法
2019/06/06 Javascript
Vue实现验证码功能
2019/12/03 Javascript
Python3实现的画图及加载图片动画效果示例
2018/01/19 Python
python3实现163邮箱SMTP发送邮件
2018/05/22 Python
Python图像处理之gif动态图的解析与合成操作详解
2018/12/30 Python
python实现多层感知器MLP(基于双月数据集)
2019/01/18 Python
Python企业编码生成系统之系统主要函数设计详解
2019/07/26 Python
多版本python的pip 升级后, pip2 pip3 与python版本失配解决方法
2019/09/11 Python
Python FtpLib模块应用操作详解
2019/12/12 Python
Python.append()与Python.expand()用法详解
2019/12/18 Python
Python爬虫之App爬虫视频下载的实现
2020/12/08 Python
3种方式实现瀑布流布局小结
2019/09/05 HTML / CSS
Viking比利时:购买办公用品
2019/10/30 全球购物
科级干部群众路线教育实践活动个人对照检查材料
2014/09/19 职场文书
党员干部民主生活会议批评与自我批评材料
2014/09/20 职场文书
用人单位的规章制度,怎样制定才是有效的?
2019/07/09 职场文书
分享python函数常见关键字
2022/04/26 Python