javascript/jquery键盘事件介绍
一、首先需要知道的是:
1、keydown()
keydown事件会在键盘按下时触发.
2、keyup()
keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件
3、keypress()
keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键
二、获得键盘上对应的ascII码:
$(document).keydown(function(event){
alert(event.keyCode);
});
$tips: 上面例子中,event.keyCode就可以帮助我们获取到我们按下了键盘上的什么按键,他返回的是ascII码,比如说上下左右键,分别是38,40,37,39;
三、实例(当按下键盘上的左右方面键时)
代码如下:
$(document).keydown(function(event){
//判断当event.keyCode 为37时(即左方面键),执行函数to_left();
//判断当event.keyCode 为39时(即右方面键),执行函数to_right();
if(event.keyCode == 37){
to_left();
}else if (event.keyCode == 39){
to_right();
}
else if (event.keyCode == 38){
to_top();
}
else if (event.keyCode == 40){
to_bottom();
}
});
function to_left(){ $(".abc").css({'left':'-=10'});}
function to_right(){ $(".abc").css({'left':'+=10'});}
function to_top(){$(".abc").css({'top':'-=10'});}
function to_bottom(){$(".abc").css({'top':'+=10'});}
javascript/jquery键盘事件介绍的更多相关文章
- js进阶 12-4 jquery键盘事件如何使用
js进阶 12-4 jquery键盘事件如何使用 一.总结 一句话总结:键盘和鼠标都是外设输入设备,所以函数很像,所以使用就像鼠标事件click一样 1.jquery键盘事件有哪三个? 1(up和do ...
- javascript的键盘事件大全
javascript的键盘事件大全 ------------------------------------------------------------------- 使用event对象的keyC ...
- jquery键盘事件全记录
很多时候,我们需要获取用户的键盘事件,下面就一起来看看jquery是如何操作键盘事件的. 一.首先需要知道的是: 1.keydown() keydown事件会在键盘按下时触发. 2.keyup() k ...
- JavaScript 模拟键盘事件
JavaScript 模拟键盘事件和鼠标事件(比如模拟按下回车等) 2016年09月08日 15:23:25 神秘_博士 阅读数:41158 标签: javascript鼠标键盘事件模拟更多 个人分类 ...
- JavaScript获取键盘事件
JavaScript中: onkeydown 事件会在用户按下一个键盘按键时发生. onkeypress 事件会在键盘按键被按下并释放一个键时发生. onkeyup 事件会在键盘按键被松开时发生. 支 ...
- jquery 键盘事件的使用方法详解
转自:https://www.jb51.net/article/123579.htm jQuery处理键盘事件有三个函数,根据事件发生的顺序分别是: jquery 代码: 1. keydown(); ...
- 3-3 编程练习:jQuery键盘事件案例
3-3 编程练习 完善下面的代码,在input框中输入内容的时候同样显示在下面的p标签中 <!DOCTYPE html> <html lang="zh-CN"&g ...
- js/jquery键盘事件及keycode大全
js/jquery的键盘事件分为keypress.keydown和keyup事件 一.键盘事件 1.keydown()事件当按钮被按下时,发生 keydown 事件. 2.keypress()事件ke ...
- jquery键盘事件总结
在工作中在发现同事在写输入密码按键的相关js效果时,发现自己对于这块很是不了解,这几天特地了解了一下,进行以下总结: 一.首先要知道键盘事件的几个属性: 1.keydown():在键盘按下时触发. 2 ...
随机推荐
- php中的抛出异常和捕捉特定类型的异常
测试环境:PHP5.5.36 Safari 9.1.2 异常捕获,在现在很多ide工具里都可以用快捷键很方便的添加上,防止用户看到自己看不懂的报错甚至莫名其妙崩溃,导致用户体验不好. 哪怕显示一 ...
- WPF下递归生成树形数据绑定到TreeView上
最终效果图:(用于学习类的效果 图片丑了点,看官莫怪) 新建窗体 然后在前端适当位置插入如下代码: <TreeView x:Name="> <TreeView.ItemTe ...
- swift学习笔记之-闭包
//闭包 import UIKit /*闭包(Closures): 函数.闭包.类都是引用类型(引用类型的实例赋值给变量或常量时,得到的都是该实例的引用,而值类型的实例变量得到的是独立的值的拷贝) 1 ...
- parseInt第二个参数详解
前阵子在stackOverflow上看到两个这样的问题: 为什么parseInt(8,3) == NaN,parseInt(16,3) == 1? 为什么parseInt('dsff66',16) = ...
- SharePoint 2013 中自定义WCF服务
在使用SharePoint2013的时候,如果其他客户端 API 的组合不足,可以通过自定义 Web 服务扩展 SharePoint.默认情况下,SharePoint 2013 不仅支持创建自定义 A ...
- [ html canvas 透明度 globalApha ] canvas绘图属性 透明度 globalApha 属性演示
<!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...
- 迭代器iterator(三):Listlterator遍历arraylist,并用逆序输出结果
迭代器(iterator) 是一种对象,它能够用来遍历标准模板库容器中的部分或全部元素,每个迭代器对象代表容器中的确定的地址.迭代器修改了常规指针的接口,所谓迭代器是一种概 念上的抽象:那些行为上像迭 ...
- Android源码分析之HandlerThread
HandlerThread是一种特殊的Thread,也就是有Looper的thread,既然有looper的话,那我们就可以用此looper来 创建一个Handler,从而实现和它的交互,比如你可以通 ...
- iOS开发之网络编程--2、NSURLSessionDownloadTask文件下载
本文内容大纲: 1.回顾NSURLSessionTask 2.NSURLSessionDownloadTask大文件之block下载 3.NSURLSessionDownloadTask大文件之代理方 ...
- jquery1.0源码【1-60行】构造函数及全局$变量
一.jquery源码1-60行 该部分代码主要完成jquery对象的创建,以及全局变量$与jQurey类的映射: /* * jQuery - New Wave Javascript * * Copyr ...