加载新页面时检查是否已按下键(JavaScript)

时间:2015-02-24 10:07:40

标签: javascript jquery keypress keylistener keydown

我目前正在构建一个使用JavaScript自定义快速导航的网站。

如果用户按下右键,他将被导航到我的页面列表中的下一页,通过按ALT +向右或向左键,他可以在浏览器历史记录中前后导航。

这是我目前的代码:

var map = [];

    window.onkeydown = window.onkeyup = function(e){
        e = e || event; // to deal with IE
        map[e.keyCode] = e.type == 'keydown';

        if (map[18] && map[39]) { // ALT + Right
            window.history.forward();
        }
        else if (map[18] && map[37]) { // ALT + Left
            window.history.back();
        }
        else if (map[39]) { // Right Key
            window.location.href = "{{ path('sctn_findsong') }}";
        }
        if (map[38]){ // Up Key
            //
        }
        if (map[40]){ // Down Key
            //
        }
    }

一切正常,除了一个小问题: 假设我想要回三页 - 如果我是一个逻辑思维的人,我会先按ALT + Left返回一个站点,然后当我在上一个站点时,按住ALT并按左键再次回到另一个网站。然而,当我回到一个站点并按下ALT时,它没有注册ALT仍然被按下,所以每次我到达之前的站点时我都必须再次按ALT,这非常烦人。 我如何让它以我想要的方式工作? 帮助赞赏。

3 个答案:

答案 0 :(得分:1)

这是不可能的。你需要一个活动" keyup"或者" keydown"在加载新页面后能够知道ALT键的状态。但是,您可以将状态(boolean down或up)存储在localStorage中。加载新页面时,您可以读取该值。但是,这可能不太可靠,尤其是在页面加载期间(页面加载之前)释放密钥时。此外,您还需要在每个加载的页面中包含处理keyevents / localStorage的JavaScript。

您是否考虑过更改Web应用程序的设计,以便通过异步(ajax)请求加载页面内容?这样,您实际上不会离开主页面并可以跟踪触发的事件。缺点是你需要创建自己的"历史"因为你实际上没有从浏览器的角度留下一个页面。这样做的好方法是使用window.location.hash

答案 1 :(得分:0)

如果您不想使用 AJAX

,可以将页面加载到IFRAME

答案 2 :(得分:-1)

你应该查找e.altKey == true以查看alt键是否已关闭

var map = [];

window.onkeydown = window.onkeyup = function(e){
    e = e || event; // to deal with IE
    map[e.keyCode] = e.type == 'keydown';

    if(e.altKey==true){ // ALT down
    if (map[39]) { //  + Right
        window.history.forward();
        //console.log("forward");
    }
    else if (map[37]) { //  + Left
        window.history.back();
        //console.log("back");
    }
    }


    else if (map[39]) { // Right Key
        window.location.href = "{{ path('sctn_findsong') }}";
    }
    if (map[38]){ // Up Key
        //
    }
    if (map[40]){ // Down Key
        //
    }
}