score:0
Accepted answer
can you not hardcode it onto your div element?
use this question as reference if you can.
if you can't harcode it maybe try this:
document.queryselector('#yourdiv').addeventlistener('keydown', function (event) {
console.log(event.key) //change this to whatever you want it to do
})
then in your html give your div a tabindex="0"
property.
the tabindex property:
tabindex="0" allows a non-form/link/object element to be placed in the default navigation order, allowing any element to be focusable and trigger interaction.
more info here
Source: stackoverflow.com
Related Query
- Not able to dispatch KeyDown event to React Component
- Click event not firing when React Component in a Shadow DOM
- enzyme not simulating change event on React Material-UI v1 - Select component
- TypeError: dispatch is not a function. In React stateless component
- React hooks: Parent component not updating when dispatch is called in a child component
- React component not updating on final dispatch and update of redux state
- Not able to access react state from socket event handler function
- Webpack with babel-loader not able to parse react function component
- Why React component is launching onClick event on render, but not when clicked?
- Not able to add, update, delete rows in material table react using class based component. Previously it was working with functional component
- react child/parent component - onChange event just takes one character and not retaining value
- Not able to reduce the size of image in Material UI CardMedia in a React component
- React component not able to dynamically require() an image file when filename is passed down via props
- onClick event not working within nested React / Next.js component
- OnClick event of nested React component is not firing with Firefox or IE11
- React Hooks: state variable having wrong value in event handlers, not able to type in input
- onClick event in React parent component is not working
- Not able to pass Array into another component in react
- Why does the component is not re-rendering when i add @action decorator to an react event handler function
- React Component Not Updating after onClick event
- Not able to center content using the Box component in MaterialUI and React
- pageshow's event listener on a React component not working properly
- Not able to listen to a socket event in ReactJs component
- React Component not updating after calling setState in SocketIO event listener
- not able to render my react component in redux way
- React router v4 with redux not able to re-render component
- Redux reducer not updating prop value in React component from dispatch outside React components
- React event not firing in React Component
- Keydown event not working as same as onClick in React
- Not able to change the state with event handlers in React
More Query from same tag
- File Upload error - PHP and React
- NavDropdown not set to active when MenuItem child link is active
- How to create a twitter like 3-column responsive UI?
- Update value in object array with useState
- Why can't I use role authorization in my API controller
- Google Auto-ads on React.js application?
- How to solve React custom hook TypeError (0 , _ .default) is not a function?
- Remove class on previous slide
- React store promise array of objects in state
- Passing axios data from a utility file to a component
- Where should I put images files in React project?
- what is the proper way to publish a React component module in NPM without external dependencies inside?
- How to prevent state increment/decrement counter going below 1
- array.shift() not working in an axios response?
- storing values in an array using react usestate hook
- Handling URL routing with Apache and React Router
- Firebase endAt() funky behaviour with orderByChild() when paging/infinite scroll
- useLocation hook undefined on startup: TypeError: Cannot read property 'location' of undefined
- ReactJs : How to reload a component onClick
- Create-react-app don't run even just after create it
- Playwright e2e testing. What to do with oauth2 or email-passwordless authentication
- Vertical align cards in a grid material-ui
- jsx-a11y/no-static-element-interactions: how to make span clickable
- How can I pass a value to a component that doesn't have props in order to test it?
- Axios result undefined inside render() method in React
- React.js, rerender Child Component by onChange event
- Elements overlapping other in react
- Selenium click on a checkbox -React :: before
- How do I bind the function and button together in reactjs
- React Router will not take array as prop for a component