How to select all on focus in input using JQuery?

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.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <script src="
">
    </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>

chevron_right


Output:



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.