-2

I am very new to Javascript, Basically i want to call a simple javascript event on keypress of function keys in the keyboard. The below code provides the current date and time on click of a button, Similarly can we call a javascript event on keypress of function keys?

<input type = "text" onkeypress="document.getElementById('demo').innerHTML=Date()">The time is?

<p id="demo"></p>
coder12345
  • 1
  • 1
  • 5
  • 1
    Did you add a keypress event handler and see? – epascarello Aug 11 '17 at 13:30
  • 1
    See this answer: https://stackoverflow.com/questions/1846599/how-to-find-out-what-character-key-is-pressed – Shivam Sharma Aug 11 '17 at 13:31
  • 4
    Possible duplicate of [How to find out what character key is pressed?](https://stackoverflow.com/questions/1846599/how-to-find-out-what-character-key-is-pressed) – tima Aug 11 '17 at 13:34

2 Answers2

1

You just need to use an Event Listener then filter it by key code.

document.addEventListener("keydown", function(event) {
  event.preventDefault();
  switch (event.which) {
    case 112:
      setMessage("You just pressed F1!");
      break;
    case 113:
      setMessage("You just pressed F2!");
      break;
    case 114:
      setMessage("You just pressed F3!");
      break;
    case 115:
      setMessage("You just pressed F4!");
      break;
    case 116:
      setMessage("You just pressed F5!");
      break;
    case 117:
      setMessage("You just pressed F6!");
      break;
    case 118:
      setMessage("You just pressed F7!");
      break;
    case 119:
      setMessage("You just pressed F8!");
      break;
    case 120:
      setMessage("You just pressed F9!");
      break;
    case 121:
      setMessage("You just pressed F10!");
      break;
    case 122:
      setMessage("You just pressed F11!");
      break;
    case 123:
      setMessage("You just pressed F12!");
      break;
  }
})

function setMessage(msg) {
  document.querySelector('.demo').innerHTML = msg;
}
<div class="demo">Press a function button</div>
Andrew Bone
  • 7,092
  • 2
  • 18
  • 33
  • Thanks for the reply, but code is still not working function keys. The event is not reachable as i press any of the function keys. – coder12345 Aug 12 '17 at 07:20
0

It's VERY simple, there is a onkeypress event:

<button onkeypress="document.getElementById('demo').innerHTML=Date()">The time is?</button>

<p id="demo"></p>

I think this does not require an explanation.

P.S.
  • 15,970
  • 14
  • 62
  • 86