How to select all on focus in input using JQuery?

Last Updated : 31 Oct, 2019

The select() event is applied to an element using jQuery when the user makes a text selection inside an element or on focus the element. This event is limited to some fields. Syntax:

$("selected element").select();

 //Select all Input field on focus $("input").select(); //Select Input field on focus whose type="text" $("input[type='text']").select(); //Select input field using its id="input-field" $("#input-field").select();

Example: In below example, select all made on input element of the form using focus, focus and click event.

html

<!DOCTYPE html> <html> <head> <script src=" https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js ">  </script> <style>  input {  margin: 12px;  }    ::-moz-selection {  /* Code for Firefox */  color: white;  background: red;  }    ::selection {  color: white;  background: red;  }  </style> </head> <body align="center"> <form action="/action_page.php" autocomplete="off"> First name: <input type="text" name="fname" value="Geeks" required> <br> Last name: <input type="text" name="lname" value="forGeeks" required> <br> E-mail: <input type="email" name="eid" value="carear@geeksforgeeks.org" /> <br> Password: <input type="password" name="upwd" value="********" required maxlength="8"> <br> User Age: <input type="number" name="Test" min="10" value="24" max="80" required/> <br> Your web Profile: <input type="url" name="Test" value="http://geeksforgeeks.org" required /> <br> <input type="submit" value="Submit"> </form> <script>  $("input[type='text']").on("click", function() {  $(this).select();  });  $("input").focus(function() {  $(this).select();  });  $("input").focusin(function() {  $(this).select();  });  </script> </body> </html>