一.键盘事件

  • onkeydown: 按下键盘时触发

  • onkeypress: 按下有值的键时触发

    注意: onkeypress按下 Ctrl、Alt、Shift、Meta 这样无值的键,这个事件不会触发对于有值的键,按下时先触发 keydown 事件,再触发这个事件

  • onkeyup:松开键盘时触发该事件

二.组合键

  • ctrl相关

  • alt相关

  • meta (Mac键盘是一个四瓣的小花,Windows键盘是Windows键) 相关

  • shift相关

写一个举例其他都类似

比如ctrl+c

window.onkeydown=function (e) {
if (e.ctrlKey) { //其他几个类似shiftkey,altkey,metakey
if( e.key == 'c'){ //这里最好用keycode可以无视大小写,你要是区分大小写最好这样写
console.log('ctrl+c')
}
}
} //一般简写
window.onkeydown=function (e) {
if (e.ctrlKey&&e.key == 'c'){console.log('ctrl+c')}
}

三.拦截preventDefault

比如拦截ctrl+h事件

<script>
window.onkeydown=function (e) {
if (e.ctrlKey) {
if( e.key == 'h'){
console.log('ctrl+h')
e.preventDefault();
}
}
}
</script>

但是有些按键没法拦截具体为啥没有深究过也没用到过,比如 Chrome

CtrlN
CtrlShiftN
CtrlT
CtrlShiftT
CtrlW
CtrlShiftW
//没法拦截

js键盘事件以及键盘事件拦截的更多相关文章

  1. Js键盘事件全面控制,回车按键事件,键盘对应按键码,按键事件兼容各个浏览器。

    在网上查询的按键码如下: 一.键盘按键和键盘对应代码表:   字母按键码A <--------> 65 B <--------> 66 C <--------> 6 ...

  2. Atitit.js的键盘按键事件捆绑and事件调度

    Atitit.js的键盘按键事件捆绑and事件调度 1. Best的方法还是 objEvtMap[ id+evt ]=function(evt,element) 2. Event bind funct ...

  3. js进阶 12-4 jquery键盘事件如何使用

    js进阶 12-4 jquery键盘事件如何使用 一.总结 一句话总结:键盘和鼠标都是外设输入设备,所以函数很像,所以使用就像鼠标事件click一样 1.jquery键盘事件有哪三个? 1(up和do ...

  4. DOM事件处理程序-事件对象-键盘事件

    事件流: 事件流--描述的是从页面中接受事件的顺序 IE  ---事件冒泡流:即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播至最不具体的那个节点(文档). Netsc ...

  5. jQuery基础(鼠标事件,表单事件,键盘事件,自定义事件 篇)

    1.jQuery鼠标事件之click与dbclick事件   方法一:$ele.click()(不带参数)   <div id="test">点击触发<div&g ...

  6. java:javaScript(定义方式,循环语句,函数与参数,事件机制,控制台记录,event事件获取键盘ascii,confirm和prompt,事件和内置对象,获取input,点击更换背景色)

    1. 定义JS的两种方式: <!DOCTYPE> <html> <head> <meta charset="UTF-8"></ ...

  7. 前端(十五)—— JavaScript事件:绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  8. Python_Selenium之basepage 识别元素、浏览器操作、获取属性、鼠标事件、键盘事件、弹窗、切换frame、切换句柄等封装

    #coding=gbkimport osimport timefrom selenium import webdriverfrom selenium.webdriver.common.by impor ...

  9. jacascript 鼠标事件和键盘事件

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 鼠标事件 鼠标事件共10类,包括click.contextmenu(右键).dblclick(双击).mo ...

  10. jQuery-3.事件篇---键盘事件

    jQuery键盘事件之keydown()与keyup()事件 鼠标有mousedown,mouseup之类的事件,这是根据人的手势动作分解的2个触发行为.相对应的键盘也有这类事件,将用户行为分解成2个 ...

随机推荐

  1. PHP目前常见的五大运行模式

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/xujingzhong0077/artic ...

  2. 浅谈Httpmodules

    HttpModule是ASP.NET过滤器,可以理解为HTTP请求的必经之地我们只要实现IHttpModule接口,就可以取代HttpModule namespace BookShop.Handler ...

  3. 松软科技web课堂:SQLServer之UCASE() 函数

    UCASE() 函数 UCASE 函数把字段的值转换为大写. SQL UCASE() 语法 SELECT UCASE(column_name) FROM table_name SQL UCASE() ...

  4. ant 打包脚本

    现在很多人都用ant脚本来进行打包,下面就介绍一下这个打包工具常见的用法.以及脚本如何编写 <!-- 定义任务,清空任务:清空原有的classes目录,重新创建 --> <targe ...

  5. Dynamics CRM - js中用webapi基于fetchxml查询遇到的问题 -- Invalid URI: The Uri scheme is too long.

    最近用WebApi做基于Fetchxml的查询的时候,遇到一个很蛋疼的报错:Invalid URI: The Uri scheme is too long. 检查了整个URL,也没发现有什么问题. - ...

  6. Angular回顾(1)

    一.前端基础 HTML:超文本标记语言,文档排版. DOM:文档对象模型. JS: 脚本语言,解释执行:动态操作DOM,服务器交互,用户交互. CSS:层叠样式表. 二.Angular前提 TypeS ...

  7. django验证码captcha

    官方文档 https://django-simple-captcha.readthedocs.io/en/latest/usage.html#installation 使用命令安装pip instal ...

  8. 华硕飞行堡垒_安装kali后N卡问题

      问题来源: 因业务需要,最近打算安装kali linux操作系统,但是安装完成后开机过一会就会卡死,而且没办法进入用户的登录界面 问题分析: 笔记本电脑信息: 华硕飞行堡垒5 TUF GAMING ...

  9. macOS 10.15 开启 HiDPI

    普通的显示,接上 MacBook 发现原生的分辨率设置在 2K 显示器上字体很小,换成 1080P 分辨率显示效果又特别模糊.下面介绍MacBook强行开启 HiDPI. 什么是 HiDPI 它使用横 ...

  10. Java Web 学习(9) —— EL 与 JSTL

    EL 与 JSTL EL与JSTL的作用是为了减少JSP页面中的代码. EL EL(Expression Language):表达式语言 常用于取值 语法 EL 表达式以${开头,以}结束. 多个表达 ...