input ref focus code example

Example 1: html input autofocus

<form action="/action_page.php">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname" autofocus><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit">
</form>

Example 2: input outline focus

input:focus, textarea:focus {
    background-color: #FFFF66;
    border: 1px solid #F47E58;
}

Example 3: react focus textarea

const focusDiv = useRef();

useEffect(() => {
 if(focusDiv.current) focusDiv.current.focus(); 
}, [focusDiv]);

return (
  <div ref={focusDiv}></div>
);

Tags:

Css Example

Related