Please help me get the sounds to play on key press

JavaScript
1

This is my attempt at it:

image
image758×1112 97.8 KB

I’m stumped because i’ve tried so many different things and none of them have worked

2

hey @JudgeFudge19,

You cant add onKeyPress to a div element but what you can do is have an event listener to listen for the the key press so something like this

 useEffect(() => {
    document.addEventListener('keydown', handleKeyPress)
  }, [])

  function handleKeyPress(event) {
    const key = event.key.toUpperCase()
    document.getElementById(key).play()
  }
3

Thank you! Is there a way i could tie this to specific keys? It fires whenever i press any key

4

@JudgeFudge19 so it only plays when one the keys on the pad is pressed?

 if ("QWEASDZXC".includes(key)) {
       document.getElementById(key).play();
  }