js && Jquery 的回车事件
有时候我们需要捕获页面上的回车事件,以达到一些特殊效果,例如在登录页面用户输入完登录名和密码后习惯直接敲回车,这时需要捕获回车事件,在回车事件中激活form元素
1.纯Java Script版
首先要捕获 document对象的按钮弹起事件(捕获按下事件也可以),浏览器会将用户按下的按键信息对象传递到事件回调函数中(以参数的形式),传入函数中的这个按键信息中包含了一个用来识别按键的编号(每个按键都有一个对应的编号),而回车按键对应的编号就是13,所以我们取出按键信息对象中的这个编号,判断它是不是13就可以了,初始版本如下:
document.onkeyup = function (e) {//按键信息对象以函数参数的形式传递进来了,就是那个e
var code = e.charCode || e.keyCode; //取出按键信息中的按键代码(大部分浏览器通过keyCode属性获取按键代码,但少部分浏览器使用的却是charCode)
if (code == 13) {
//此处编写用户敲回车后的代码
}
}
可这样有个问题,在旧版IE下,按键信息对象并不是直接传递到函数中的,所有的事件对象是存储在window.event中的,所以为了兼容旧版IE,我们可以先判断一下window.event这个对象存在不存在,若存在,说明是旧版IE浏览器,如果不存在,说明是chrome、火狐之类的新式浏览器,改良版如下:
document.onkeyup = function (e) {
if (window.event)//如果window.event对象存在,就以此事件对象为准
e = window.event;
var code = e.charCode || e.keyCode;
if (code == 13) {
//此处编写用户敲回车后的代码
}
}
2.Jquery版
思路和纯JavaScript代码类似,不过Jquery实现起来可能更简单一些,因为Jquery本身就已经在某些方面做了浏览器兼容性设置,所以代码会比较简洁一些
$(document).keyup(function (e) {//捕获文档对象的按键弹起事件
if (e.keyCode == 13) {//按键信息对象以参数的形式传递进来了
//此处编写用户敲回车后的代码
}
});
转自:曾经最美的记忆
js && Jquery 的回车事件的更多相关文章
- 原 JS监听回车事件
原 JS监听回车事件 发表于2年前(2014-06-04 10:16) 阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦 ...
- jquery响应回车事件
简单地记下jquery实现回车事件,代码如下: 全局: $(function(){document.onkeydown = function(e){ var ev = document.all ...
- jquery 键盘回车事件
<input id="search" placeholder="输入要领用的资产条码" id="scanCode" type=&quo ...
- jquery绑定回车事件
//回车事件绑定 $(".left-content").keyup(function(event){ var theEvent = event || window.event; v ...
- js监听回车事件
标题通俗的说,也就是绑定当用户按下回车键要执行的事件. 下面,入正题. 第一步,先编写简单的页面代码,这里我们只需要一个按钮就足够了.当然,还有按钮事件. <html> <head& ...
- js dom添加回车事件
<!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta ...
- js捕获页面回车事件
1.javascript版 document.onkeyup = function (e) { if (window.event)//如果window.event对象存在,就以此事件对象为准 e = ...
- form表单回车提交问题,JS监听回车事件
我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此.比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键 ...
- js&jquery:添加事件的三种方法和常用的一些事件
一.添加事件的方法 1.EventTarget.addEventListener添加 获取事件目标元素,通过addEventListener函数添加 // Assuming myButton is a ...
随机推荐
- isKindOfClass in cocos2d-x
在最新版2.*的cocos2d-x中isKindOfClass可以用如下代码代替. 未验证,不过看了引擎代码是这样写的 原代码 [s1 isKindOfClass:[DestHole class] ...
- Python判断变量的数据类型的两种方法
https://www.cnblogs.com/jessicaxu/p/7727264.html
- jeecms系统使用介绍——通过二次开发实现对word、pdf、txt等上传附件的全文检索
转载请注明出处:http://blog.csdn.net/dongdong9223/article/details/76912307 本文出自[我是干勾鱼的博客] 之前在文章<基于Java的门户 ...
- 代理模式及Spring AOP (一)
一.代理模式 在不更改源码的前提下,加入新功能,通常需要用到代理设计模式. 代理设计模式分类: 静态代理 动态代理 jdk动态代理 cglib动态代理 其中spring AOP的底层用的是动态代理.其 ...
- Struts2重学习之作用域的获取
第一种:获取requestMap,sessionMap,applicationMap, HttpServletRequest,HttpServletResponse对象的获取,在Struts2中 pu ...
- 用 c 写 CGI 程序简要指南
文章摘要: CGI规定了Web服务器调用其他可执行程序(CGI程 序)的接口协议标准.Web服务器通过调用CGI程序实现和Web浏览器的交互.CGI程序可以用任何程序设计语言编写,如Shell脚本语 ...
- centos 修改时区及NTP时间同步
在我们使用CentOS系统的时候,也许时区经常会出现问题,有时候改完之后还是会出错,下面我们就来学习一种方法来改变这个状况.如果没有安装,而你使用的是 CentOS系统 那使用命令 yum insta ...
- bzoj 2616 SPOJ PERIODNI——笛卡尔树+树形DP
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2616 把相同高度的连续一段合成一个位置(可能不需要?),用前缀和维护宽度. 然后每次找区间里 ...
- CF 1013E Hills——隔项转移的DP
题目:http://codeforces.com/contest/1013/problem/E 设 dp[ i ][ j ][ 0/1 ] 表示前 i 个位置,有 j 个山峰,第 i 个位置不是/是山 ...
- php中is_null,empty,isset,unset 的区别详细介绍
is_null, empty, isset, unset 我们先来看看这4个函数的描述. isset 判断变量是否已存在(配置)unset 把变量删除(释放)掉empty 判断变量是否为空is_nul ...