---

Search posts under jQuery:

---

Select text / Attach select event in jQuery

How to select text or attach select event to a html element in jQuery?

To select text or attach select event to a html element, select() method can be used.

<div id="divSelect" style="cursor: pointer;">Click here to select below text</div>

    <textarea id="txtAreaSelect" cols="20" rows="5">Try selecting this text</textarea>

    <script>
        // first function
        $("#txtAreaSelect").select(function () {
            alert("you are trying to select");
        });

        // second function
        $("#divSelect").click(function () {
            $("#txtAreaSelect").select();
        });
    </script>

In the first jquery function when user tries to select the text inside “txtAreaSelect”, he/she is alerted with message "you are trying to select".
In the second function we have attached a click event to the “divSelect” element and when it is clicked the text of “txtAreaSelect” is selected that in tern raises .select event of the textbox (because of first function) and shows alert message. If we remove the first function, this function simply select the text of the textarea element.