Question

Normally when text within TinyMCE (or any other editor) is clicked, then the caret is placed there and/or a text selection is begun.

I don’t want anything like that to happen. I want that when the editable textarea is clicked, then nothing should happen. How can I do this?

In my set up function I have this code, following up from a previous question, which ensures that all text in an instance is selected as soon as TinyMCE is turned on:

    ed.onInit.add(function(ed, evt) {
      var range = ed.selection.dom.createRng();
      range.setStartBefore(ed.getBody().firstChild);
      range.setEndAfter(ed.getBody().lastChild);
      ed.selection.setRng(range);
            });

Now that all text is selected, I don’t want the user to have the ability to deselect it or select any other range in the text. So I want the user’s clicks to do nothing. I tried to add this in the same setup function:

ed.onClick.add(function(ed, evt) {
  console.debug('Editor was clicked: ' + evt.target.nodeName);
  evt.preventDefault();
  evt.stopPropagation();            
        }); 

but while the console message showed up, the click still de-selected the range of text that was already selected. How can I make sure that clicks do nothing? Or at least that they don’t affect the already-selected range of text?

Answer 1

Try negating the mousedown event instead of the click event, which is triggered afterwards.