4

I have an application that does something (eg alert) each time a spacebar is pressed. This works fine if I am not using JAWS screen reader. However, once I load JAWS screen reader, it does not execute alert when I press the spacebar. I need to use JAWS so I need this to work. Here is the code snippet.

$(document).keypress(function(event) {
    var chCode = ('charCode' in event) ? event.charCode : event.keyCode;
    if (chCode == 32){ //32 is keyCode for spacebar
      alert("spacebars!!!");
    }
});

From my observation, it seems JAWS grabs the keyboard focus and wouldn't allow the spacebar event to fire. JAWS always reads "Space" when I press the spacebar but the alert event does not fire. How can I still get the alert or doSomething() to fire when the spacebar is pressed? How can I take control from JAWS or maybe share keyboard control with JAWS such that even though JAWS reads out the character I pressed (in this case Spacebar), it will allow my event (alert) to fire. Thanks.

More code:

$(document).keypress(function(event) {
  var cc= ('charCode' in event) ? event.charCode : event.keyCode;       
       if (cc == 32)
    {
      spArray.push(Number(new Date()));
    }
});
JasonMArcher
  • 14,195
  • 22
  • 56
  • 52
bdfios
  • 657
  • 6
  • 17
  • 29

2 Answers2

12

In general, it is not advisable to over-ride screen readers, even if they let you. There are quite a few JAWs keyboard commands (in conjunction with INS) that use the spacebar, and you'd probably lock those commands out.

If the area is primarily formed controls or interactive widgets then you could wrap it in an element with role="application". That puts a (windows) screen reader into 'forms' mode, where keys are passed through to the web-page.

Do not wrap everything in role="application", just the interactive area.

Update: With more information, this is about an audio-based capture where the user triggers an audio file, then triggers something again to set a time and pass the capture.

Using a native button, Jaws will pass through the use of enter (not sure about space, that isn't the usual 'activate' key). I'd suggest either checking for enter key (charcode 13 I think), or even onclick should work. On a native button/link it works across screen readers.

$(document).click(function() {
   spArray.push(Number(new Date()));
});

Assuming that's in the right location so that it doesn't become active until needed. (JS isn't my strong point, but go with the enter key or onclick.

Prashant Tapase
  • 2,132
  • 2
  • 25
  • 34
AlastairC
  • 3,277
  • 21
  • 15
  • Thanks for your feedback. As per context, I am working on an audio captcha. The captcha controls (play and reload buttons) are on the form page. Users answer the captcha by pressing the spacebar to answer the test. I need to capture the current time each time a spacebar is pressed, but JAWS does not allow the spacebar to be captured but it will read out "Space" each time a spacebar is pressed. I need a way to capture the spacebar just like it works when JAWS is not used. I will try the application role you mentioned and see if it helps. Thanks. – bdfios Apr 15 '14 at 00:35
  • Have you tried using a button and accepting onkeypress or even onclick? Using a standard control means that Jaws would pass through pressing enter and trigger an onclick/onkeypress. – AlastairC Apr 15 '14 at 06:15
  • Yes I did. it was implemented this way: onClick a play button, begin to listen to keypress. Please see the code addition above. – bdfios Apr 15 '14 at 06:46
  • I also tried placing role="application" on body tag as well as child tag at different times but hasn't worked. – bdfios Apr 15 '14 at 06:51
  • Thanks for providn more explanation. I had tried pressn other keys instead of the spacebar and noticed that it wouldn't accept many characters but it does accept a few characters such as [, ], and ' and once a character (eg right squared bracket "]") is pressed, it then starts acceptn the spacebar. Because of this behavior, I programmatically pressed "]" key on clicking the play button expectin the key to trigger the acceptance of spacebar as it happens when I manually do so, but no, it didn't work. I keep tryn other techniques and I thank u for ur helpful comments. I hope this gets resolved. – bdfios Apr 15 '14 at 07:33
  • As a really simple demo, this works to receive an event across Jaws/NVDA/VoiceOver: http://codepen.io/alastc/full/wescu/ – AlastairC Apr 15 '14 at 12:47
0

An event handler declared like this works in our application:

doKeyDown_: function (evt) {
    var key = evt.keyCode || evt.which;
    //arrows
    if (key == 27 || (key >= 37 && key <= 40)) {
        try {
            if (key >= 37 && key <= 40) {
                this.handleArrwos(evt);
            } else {
                this.handleEsc(evt);
            }
        ...

Although it is based on the ZK platform, the inner engine is still JQuery. Please note that the event is keyDown (not keyPress) and how the pressed key is detected. The example is for Esc and arrow keys - Space should be no problem.

As for accessibility, our etire page is declared as role="application", since the entire content is a dynamically generated page, it's really an application. Only this way Jaws doesn't eat up about any possible keys combination.

Flaviu Decean
  • 19
  • 2