js 键盘事件 鼠标单击事件

事件名称 说明 onkeypress 这个事件在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。 onkeyup 这个事件在用户放开任何先前按下的键盘键时发生。 onkeydown 这个事件在用户按下任何键盘键（包括系统按钮，如箭头键和功能键）时发生。 ### JavaScript中的键盘事件详解 #### 一、概述 在JavaScript中，键盘事件是与用户键盘输入相关的事件。这些事件主要用于捕获用户的键盘操作，并根据不同的按键执行相应的逻辑处理。本篇文章将详细介绍`onkeypress`、`onkeyup`和`onkeydown`这三个事件。 #### 二、`onkeypress`事件 `onkeypress`事件会在用户按下并释放一个字母或数字键时触发。此事件不支持系统键（例如箭头键和功能键）。`onkeypress`事件主要适用于需要监听特定字符键的应用场景。 **示例代码：** ```javascript document.onkeypress = function(event) { if (event.keyCode === 65) { // 按下A键 console.log('A键被按下'); } }; ``` #### 三、`onkeyup`事件 `onkeyup`事件会在用户释放之前按下的任何键盘键时触发。该事件可以用于实现诸如按键计数器等功能，记录用户按键的行为。 **示例代码：** ```javascript document.onkeyup = function(event) { console.log('键 ' + event.keyCode + ' 被释放'); }; ``` #### 四、`onkeydown`事件 `onkeydown`事件会在用户按下任意键盘键时触发，包括系统键（如箭头键和功能键）。因此，`onkeydown`事件比`onkeypress`更通用，可以监听到更多的按键类型。 **示例代码：** ```javascript document.onkeydown = function(event) { if (event.keyCode === 39) { // 按下右箭头键 window.location.href = "http://www.163.com"; // 跳转到指定网址 } }; ``` #### 五、事件对象属性 在处理键盘事件时，通常会使用`event`对象来获取有关按键的信息。下面是一些常用的属性： - `event.keyCode`：返回按键的虚拟键码。 - `event.key`：返回按键的字符值。 - `event.altKey`：如果按下Alt键，则为true。 - `event.ctrlKey`：如果按下Ctrl键，则为true。 - `event.shiftKey`：如果按下Shift键，则为true。 #### 六、示例应用 下面是一个示例，演示如何使用`onkeydown`事件来拦截某些键的操作： ```javascript function keyDown() { if ((event.altKey) && ((event.keyCode === 37) || (event.keyCode === 39))) { alert("不允许使用ALT+方向键"); event.returnValue = false; } if (event.keyCode === 8 || event.keyCode === 116) { // Backspace 或 F5 event.keyCode = 0; event.returnValue = false; } if ((event.ctrlKey) && (event.keyCode === 78)) { // Ctrl+n event.returnValue = false; } if ((event.shiftKey) && (event.keyCode === 121)) { // Shift+F10 event.returnValue = false; } if (event.keyCode === 122) { // F11 event.returnValue = false; } } document.onkeydown = keyDown; ``` #### 七、ASCII码表 为了更好地理解和使用键盘事件，了解ASCII码是非常有帮助的。以下是一部分ASCII码及其对应的字符： - 27: ESC - 32: SPACE - 33: ! - 34: " - ... - 116: t - 117: u - 118: v - ... #### 八、小结 通过本文的学习，我们可以了解到JavaScript中`onkeypress`、`onkeyup`和`onkeydown`三个键盘事件的基本用法以及如何在实际项目中进行应用。同时，还介绍了如何利用`event`对象来获取更多信息，以及如何使用ASCII码表来理解按键的具体含义。希望本文能够帮助开发者更好地掌握键盘事件的相关知识，提高编程效率。