How to Create Auto Select Textarea on Hover

Posted by Lasantha Bandara on December 11th, 2023 File Under : html, java script0 Comment

You may want to create a auto select text area with content for your viewers to copy. There is an easy way to do that. Here's the HTML code for a textarea that auto-selects its content when hovered over:

<textarea style="width:332px;height:70px;" onmouseover="this.focus();this.select()">This content will be auto-selected on hover</textarea>

Above code includes:

1. A textarea element containing some pre-defined text.
2. The onmouseover event listener that triggers these two JavaScript functions:
(a). this.focus() : Sets focus on the textarea element.
(b). this.select() : Selects all the text within the textarea.

Result will look like the following :

File Under : html, java script

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.