JavaScript：键盘事件、定时器_js触发键盘按键-优快云博客

本文链接：https://blog.youkuaiyun.com/ForForever9/article/details/136785575

1:键盘事件:

keydown 事件会在按键在元素上按下时触发

keyup 事件会在按键在元素上松开时触发

键盘事件只能绑定给可以获取焦点的元素

事件对象中key属性，表示当前所按的按键

keyCode返回的是按键的编号（不区分大小写和换挡）

类似于ctrl alt shift这种功能按键，在事件对象中都有专门判断属性

ctrlKey 用来判断ctrl是否被按下，按下返回true，否则返回false

altKey 用来判断alt是否按下

shiftKey 用来判断shift是否按下

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Title</title>

<style>

#box1{

width: 200px;

height: 200px;

background-color: #ff0;

}

</style>

<script>

window.onload = function () {

var inp = document.querySelector('[type=text]');

/*

keydown 事件 会在按键在元素上按下时触发

*/

// inp.addEventListener('keydown',function () {

// console.log('按键按下了~~');

// });

/*

keyup 事件 会在按键在元素上松开时触发

*/

// inp.addEventListener('keyup',function () {

// console.log('按键松开了~~');

// });

/*

键盘事件只能绑定给可以获取焦点的元素

*/

// document.getElementById('box1').addEventListener('keydown',function () {

// console.log('哈哈哈~~~');

// });

// document.querySelector('a').addEventListener('keydown',function () {

// console.log('按键按下了~~');

// });

document.addEventListener('keydown',function (ev) {

/*

事件对象中key属性，表示当前所按的按键

keyCode返回的是按键的编号（不区分大小写和换挡）

*/

// if(ev.key.toLowerCase() === 'k'){

// alert('你按了k了！');

// }

/*

判断用户的ctrl和k是否同时被按下

*/

// if(ev.key === 'Control' && ev.key