js实现esc功能

实现ESC键功能的方法

在JavaScript中，可以通过监听键盘事件来实现ESC键的功能。ESC键的键码是27，可以通过keydown或keyup事件来捕获。

document.addEventListener('keydown', function(event) {
    if (event.key === 'Escape' || event.keyCode === 27) {
        console.log('ESC键被按下');
        // 在这里添加ESC键的功能逻辑
    }
});

关闭模态框或弹出窗口

ESC键常用于关闭模态框或弹出窗口。以下是一个简单的实现示例：

const modal = document.getElementById('modal');

document.addEventListener('keydown', function(event) {
    if (event.key === 'Escape') {
        modal.style.display = 'none';
    }
});

取消操作或返回上一页

ESC键也可以用于取消当前操作或返回上一页：

document.addEventListener('keydown', function(event) {
    if (event.key === 'Escape') {
        window.history.back();
    }
});

清除输入框内容

ESC键可以用于快速清除输入框的内容：

const input = document.getElementById('searchInput');

input.addEventListener('keydown', function(event) {
    if (event.key === 'Escape') {
        this.value = '';
    }
});

注意事项

• 确保在不需要时移除事件监听器，避免内存泄漏。
• 某些浏览器可能对ESC键的行为有默认处理，可以通过event.preventDefault()阻止默认行为。

document.addEventListener('keydown', function(event) {
    if (event.key === 'Escape') {
        event.preventDefault();
        // 自定义逻辑
    }
});

兼容性处理

对于较旧的浏览器，可以使用keyCode属性：

document.addEventListener('keydown', function(event) {
    if (event.keyCode === 27) {
        // 兼容性处理
    }
});