How to select input tag on keypress-CodePudding

Hey I have a list of input tags , I am navigating through all input tags using arrowUp and arrowDown keys I want to select input tag on pressing enter key and start typing.

<input type="text" /> selected and start typing on keypress enter

CodePudding user response：

Try this :

var el = document.getElementById("myInputID");
el.addEventListener("keydown", function(event) {
    if (event.key === "Enter") {
        // Enter key was hit
    }
});

CodePudding user response：

let's imagine you have <div > with list of inputs:

<div id="container">
    <input type="text" value="1">
    <input type="text" value="2">
    <input type="text" value="3">
</div>

    document.getElementById('container').querySelectorAll('input').forEach((node) => {
      node.addEventListener('keydown', (event) => {
        if (event.key === 'Enter') {
          // your logic here
        }
      })
    })

CodePudding user response：

    <input type="text" id="text1"><script>
    window.addEventListener("keydown", (event)=>{if (event.key == 'Enter') {document.getElementById("text1").focus()} })</script>

but this works only if you have one element