caps lock state

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|

caps lock state

Rob Garrison
Hi!

There is no way to determine the actual state of a caps lock key. I would like
to request an enhancement of the event object to include the caps lock state:

```js
document.addEventListener( 'keydown', function( event ) {
  if ( event.capsLock ) {
    alert( 'caps lock on!' );
  }
});
```

This basic method targets the "a" through "z" and capital "A" through "Z"
characters to make a comparison. This method does not include accented
characters that would be available on non-U.S. or international keyboards,
and it can only be used during a "keypress" event. "keypress" is the
only event in which `event.charCode` returns accurate values.

```js
document.addEventListener( 'keypress', function( event ) {
  var k = event.charCode;
  // ASCII uppercase A = 65; ascii uppercase Z = 90
  if ( ( ( k >= 65 && k <= 90 ) && !event.shiftKey ) ||
       // ASCII lowercase a = 97; ASCII lowercase z = 122
       ( ( k >= 97 && k <= 122) && e.shiftKey ) ) {
    alert( 'caps lock on!' );
  }
});
```

I know modern keyboards are starting to replace the caps lock key with a
control key, but I think this would still be a useful addition.

Thanks for your attention.
Reply | Threaded
Open this post in threaded view
|

Re: caps lock state

Dave Tapuska-2
Check out https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/getModifierState

It should be supported or at least in Chrome's case is making its way through the release channels.

dave.

On Mon, Dec 14, 2015 at 3:00 PM, Rob Garrison <[hidden email]> wrote:
Hi!

There is no way to determine the actual state of a caps lock key. I would like
to request an enhancement of the event object to include the caps lock state:

```js
document.addEventListener( 'keydown', function( event ) {
  if ( event.capsLock ) {
    alert( 'caps lock on!' );
  }
});
```

This basic method targets the "a" through "z" and capital "A" through "Z"
characters to make a comparison. This method does not include accented
characters that would be available on non-U.S. or international keyboards,
and it can only be used during a "keypress" event. "keypress" is the
only event in which `event.charCode` returns accurate values.

```js
document.addEventListener( 'keypress', function( event ) {
  var k = event.charCode;
  // ASCII uppercase A = 65; ascii uppercase Z = 90
  if ( ( ( k >= 65 && k <= 90 ) && !event.shiftKey ) ||
       // ASCII lowercase a = 97; ASCII lowercase z = 122
       ( ( k >= 97 && k <= 122) && e.shiftKey ) ) {
    alert( 'caps lock on!' );
  }
});
```

I know modern keyboards are starting to replace the caps lock key with a
control key, but I think this would still be a useful addition.

Thanks for your attention.