温馨提醒

如果文章内容或图片资源失效,请留言反馈,我们会及时处理,谢谢

本文最后更新于2023年10月27日,已超过 180天没有更新

需求:监听Ctrl + F 键,执行搜索框显示,并光标定位到搜索框。

1、键盘按键键码值(keyCode),字母和数字键的键码值 (keyCode)

2、监听ctrl(cmd)+ s事件:

document.onkeydown = function(e) {
        var keyCode = e.keyCode || e.which || e.charCode;
        var ctrlKey = e.ctrlKey || e.metaKey;
        if(ctrlKey && keyCode == 83) {
            alert('按住了 CTRL+S');
        }
        e.preventDefault();
        return false;
}

综合实现代码如下:

搜索框id为search,先前通过css设置display属性为none

$(function(){
    if(window.localStorage.getItem("search") == 'yes'){
        document.getElementById("search").style.display="block";
    }else{
        document.onkeydown = function(e) {
        var keyCode = e.keyCode || e.which || e.charCode;
        var ctrlKey = e.ctrlKey || e.metaKey;
        if(ctrlKey && keyCode == 70) {
            window.localStorage.setItem("search", "yes");
            document.getElementById("search").style.display="block";
            document.getElementById('s').select();
            e.preventDefault();
            jQuery('html, body').animate({ scrollTop: 0 }, 500);
            return false;
            }
        }
    }
    
});

前提:引入jQuery,使用cookie记录,是为了避免一直监听按键导致输入失效。

历史上的今天
10月
27
    抱歉,历史上的今天作者很懒,什么都没写!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。