如何使用检测键功能转到 Javascript 中的下一部分？

Question

So I'm playing with detecting keystrokes in JavaScript and I thought it would be cool to add a function to my site that would go to the next section when the down arrow is pressed and go to the previous section when the up arrow is pressed, I'm not sure how I should go about this, the source code is a bit too long to put here so my site is just https://www.hukari.tech/ , if any of you have ideas, please let me know. Thanks so much :)

Answer 1

This is a good start, but depending on how you have your site structured you will have to handle navigation differently. You can use cookies or local storage to track which page was last visited to send the client to the previous page. You can use window.history.back() to simulate the back button being pressed. If it is a single page site, you can scroll to different tags on the page, keeping track of where the client is with a global variable the keydown function checks.

 const body = document.querySelector("body"); const loadNextPage = () => body.innerText = "Next"; const loadPreviousPage = () => body.innerText = "Previous"; window.addEventListener("keydown", e => { if(e.key == "ArrowUp") { e.preventDefault(); //to prevent it from doing native scroll loadPreviousPage(); } if(e.key == "ArrowDown") { e.preventDefault(); //to prevent it from doing native scroll loadNextPage(); } });

 * { background: lightgray; }