Keith Keith - 2 months ago 18
jQuery Question

Keydown keyboard shortcut

I'm trying to create a keyboard shortcut for focus purposes (this is for 508 compliance). I'd like to be able to do it while inside an iframe body, but if this isn't possible I can go to plan B and whenever the class is highlighted, to do it from there (this is by tabbing to the link). In the fiddle, if you click anywhere inside the boxed area where the product shows and then click tab to highlight the word "Text", from there I am trying to create a shortcut ( in this case CTRL + F12 ) to have the cursor go to the input box underneath in a different div, but I haven't been able to make it work yet.

https://jsfiddle.net/5ocp1kpw/1/

<div>
<a class="link" href="#">Test</a>
</div>
<div>
<input class="final" value="here" />
</div>

$('.link').keydown(function (e) {
if (e.which === 123) {
e.preventDefault();
$(this).find('.final').focus();
}
});

AVP AVP
Answer

It's not working because you can't find .final in $(this). Remember that you put the keydown event on the .link, so you're looking for children of the .link to be .final. There are none.

The event is firing, but it can't find the element you want to focus on. Just do $('.final').focus() or find some other way to select the text box and you'll be set.

Fiddle: https://jsfiddle.net/zn9sde03/