Open In App

How to select all text in HTML text input when clicked using JavaScript?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

This example shows how to select entire input in a single click using javaScript.

Syntax:

<input onClick="this.select();" >

or

document.getElementById("ID").select();

Example-1: Using “this.select()”.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        Select all text in HTML 
      text input when clicked
    </title>
  
</head>
  
<body>
    <br> Input Text:
    <br>
    <input onClick="this.select();" 
           type="text"
           value="GeeksforGeeks">
</body>
  
</html>


Output:
Before click:

After click:

Example-2: Using DOM Input Text select() Method




<!DOCTYPE html>
<html>
  
<head>
    <title>
        Select all text in HTML
      text input when clicked
    </title>
</head>
  
<body>
    Input Text:
    <br>
    <input type="text"
           value="GeeksforGeeks"
           id="eid">
  
    <button type="button" 
            onclick="myFunction()">
      Try it
  </button>
  
    <script>
        function myFunction() {
            document.getElementById(
              "eid").select();
        }
    </script>
  
</body>
  
</html>


Output:
Before click:

After click:



Last Updated : 29 Apr, 2019
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads