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 相关文章推荐
js刷新框架子页面的七种方法代码
Nov 20 Javascript
js 数组操作之pop,push,unshift,splice,shift
Jan 29 Javascript
Bootstrap每天必学之响应式导航、轮播图
Apr 25 Javascript
jQuery中的ready函数与window.onload谁先执行
Jun 21 Javascript
从零开始学习Node.js系列教程五:服务器监听方法示例
Apr 13 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
Sep 20 Javascript
基于input动态模糊查询的实现方法
Dec 12 Javascript
ES6 Promise对象的应用实例分析
Jun 27 Javascript
node.js使用fs读取文件出错的解决方案
Oct 23 Javascript
详解vue高级特性
Jun 09 Javascript
JS如何在不同平台实现多语言方式
Jul 16 Javascript
JavaScript本地储存:localStorage、sessionStorage、cookie的使用
Oct 13 Javascript
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
PHP初学者头疼问题总结
2006/10/09 PHP
PHP模拟http请求的方法详解
2016/11/09 PHP
js实现图片放大缩小功能后进行复杂排序的方法
2012/11/08 Javascript
Jquery.addClass始终无效原因分析
2013/09/08 Javascript
jQuery前端框架easyui使用Dialog时bug处理
2014/12/05 Javascript
AngularJS内置指令
2015/02/04 Javascript
jQuery下拉友情链接美化效果代码分享
2015/08/26 Javascript
jQuery插件FusionCharts实现的2D饼状图效果【附demo源码下载】
2017/03/03 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
2018/01/11 Javascript
vue ssr 指南详读
2018/06/29 Javascript
Vue实现一个图片懒加载插件
2019/03/11 Javascript
vue-cli3中vue.config.js配置教程详解
2019/05/29 Javascript
layer.open 子页面弹出层向父页面传输数据的例子
2019/09/26 Javascript
vue实现移动端图片上传功能
2019/12/23 Javascript
[05:06]DOTA2-DPC中国联赛 正赛 VG vs Magma选手采访
2021/03/11 DOTA
Python学习笔记之常用函数及说明
2014/05/23 Python
Python实现栈的方法
2015/05/26 Python
Python实现提取谷歌音乐搜索结果的方法
2015/07/10 Python
Python应用03 使用PyQT制作视频播放器实例
2016/12/07 Python
Python线程指南详细介绍
2017/01/05 Python
Sanic框架流式传输操作示例
2018/07/18 Python
Python操作多维数组输出和矩阵运算示例
2019/11/28 Python
Python 实现自动登录+点击+滑动验证功能
2020/06/10 Python
Python 防止死锁的方法
2020/07/29 Python
python 实现关联规则算法Apriori的示例
2020/09/30 Python
英国第一摩托车和摩托车越野配件商店:GhostBikes
2019/03/10 全球购物
酒店管理毕业生自我鉴定
2014/03/02 职场文书
建筑公司员工自我鉴定
2014/04/08 职场文书
金融事务专业求职信
2014/04/25 职场文书
铁路安全事故反思
2014/04/26 职场文书
丧事答谢词
2015/01/05 职场文书
建国大业观后感800字
2015/06/01 职场文书
某某店铺的开业庆典主持词范本
2019/11/25 职场文书
豆瓣2021评分最高动画剧集-豆瓣评分最高的动画剧集2021
2022/03/18 日漫
win10电脑双屏显示一个黑屏怎么办?win10电脑双屏显示一个黑屏解决方法
2022/07/15 数码科技
使用CSS实现按钮边缘跑马灯动画
2023/05/07 HTML / CSS