Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Selecting all text in HTML text input when clicked

I have the following code to display a textbox in a HTML webpage.

<input type="text" id="userid" name="userid" value="Please enter the user ID" /> 

When the page displays, the text contains the Please enter the user ID message. However, I found that the user needs to click 3 times in order to select all the text (in this case it is Please enter the user ID).

Is it possible to select the entire text with only one click?

Edit:

Sorry, I forgot to say: I must use the input type="text"

like image 616
Questions Avatar asked Nov 01 '10 08:11

Questions


People also ask

How do you select text in HTML?

HTML | DOM Input Text select() Method The DOM Input select() method selects all the text content of a textarea or an input element which contains the text field. Syntax: element. select();

How do I select all on a HTML page?

The * selector selects all elements. The * selector can also select all elements inside another element (See "More Examples").

How do I target a specific input type in CSS?

If you only want to style a specific input type, you can use attribute selectors: input[type=text] - will only select text fields. input[type=password] - will only select password fields. input[type=number] - will only select number fields.


1 Answers

You can use this javascript snippet:

<input onClick="this.select();" value="Sample Text" /> 

But apparently it doesn't work on mobile Safari. In those cases you can use:

<input onClick="this.setSelectionRange(0, this.value.length)" value="Sample Text" /> 
like image 52
Boris Pavlović Avatar answered Oct 05 '22 20:10

Boris Pavlović