Question

I have two event handlers, one for keydown and one for keyup. The keydown event handler triggers an alert message, but this prevents the keyup event from firing.

You can see a very simple example here: http://jsfiddle.net/boblauer/jaGwT/ When the keydown opens an alert, the keyup is not fired, but when an alert is not opened, the keyup is fired. Here’s the code from the jsfiddle:

var i = 0;
window.addEventListener('keydown', function(e) {
    if (i++ % 2) alert('down');
    console.log('down');
});

window.addEventListener('keyup', function(e) {
    alert('up');
    console.log('up');
});

I have a library that supports listening to multiple key combinations (such as ‘d + f’), so when a key is pressed, I need to add it to a list of keys that are currently pressed, and when a key is released, I need to remove it from said list. The problem I’m running to is, if I want an alert to show when d + f are pressed at the same time, my code to remove those keys from the ‘currently pressed’ list never fires, because my keyup handler is never called.

I can’t think of a good work around to this problem. Any ideas?

Answer 1

The alert prevents the event from happening. What you could do instead is trigger this function manually, because it happens anyways.

var keyupfunction = function(e){
    alert('up');
    console.log('up');
}

window.addEventListener('keyup', keyupfunction);

window.addEventListener('keydown', function(e) {
    if (i++ % 2) alert('down');
    console.log('down');
    keyupfunction(e);
});

But really, you shouldn’t be using alerts. It prevents these events, but who knows what else it might break. Use something custom instead.