Question

We have a few text areas that have some text the user may copy to their clipboard.

Without going into too much detail as it will just complicate a straightforward question:

Is it possible to detect if a textarea‘s contents are ‘selected’?

---

I should mention using the onclick (or other) event handlers are (ideally…) not an option.

As this text is selected by an ‘outside of the textarea’ action.

The flow is somewhat as follows:

Drop down choice is chosen -> Text in textarea is selected

Or

Textarea is clicked (onclick) -> Text in textarea is selected

I know we could use a whole bunch of event handlers to detect the state of the text in the textarea, but I was hoping there was a simpler way of doing by detecting the state of the text inside the textarea via JavaScript.

Answer 1

This code is taken from this question. You’ll need to adapt the code slightly, but it shows how to access the selection for both Mozilla and Internet Explorer browsers –

function ShowSelection()
{
  var textComponent = document.getElementById('Editor');
  var selectedText;
  // Internet Explorer version
  if (document.selection != undefined)
  {
    textComponent.focus();
    var sel = document.selection.createRange();
    selectedText = sel.text;
  }
  // Mozilla version
  else if (textComponent.selectionStart != undefined)
  {
    var startPos = textComponent.selectionStart;
    var endPos = textComponent.selectionEnd;
    selectedText = textComponent.value.substring(startPos, endPos)
  }
  alert("You selected: " + selectedText);
}