title: Keybinding in Anki while reviewing
body: <p>I use Anki, a software of flashcards to learn a new language.<br>
  What my card looks like :
  <a href="https://i.stack.imgur.com/PQKLb.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PQKLb.jpg" alt="Interface" /></a></p>
  <p>I want to use a key on my (physical) keyboard to show/hide additional infos on my card to review my cards faster on iPad.</p>
  <p>The problem is that the document element is not focused at first (it is the answer buttons that are), so the keyup event in JS/JQuery doesn't work. I need to touch the iPad screen first to then use my keyboard if I want it to work, which kind of defeats the whole point.</p>
  <p>My code :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
  
    $(document).on('keyup', function(e) {
       var key = e.key;
       if (key == "p") {
          // My Code       
       }
    });  
  
  });</code></pre>
  </div>
  </div>
  </p>
  <p>I tried $(document).click(), $(document).trigger(&quot;click&quot;) and $(document).focus() without success. <a href="https://www.reddit.com/r/Anki/comments/gbfykz/javascript_how_to_catch_keyboard_events_while/" rel="nofollow noreferrer">Other</a> <a href="https://www.reddit.com/r/Anki/comments/gbfykz/javascript_how_to_catch_keyboard_events_while/" rel="nofollow noreferrer">people</a> (on Reddit) have had this problem but resolved it with add-ons for Anki − As I would like to make it work on iPad (so no add-on), this is not an option forme sadly.</p>
  <p>Any help would be greatly appreciated.
  Cheers!</p>