How to use a text selector in html?

To get the selected text you use the function getSelection() :

See the example:

$('p').mouseup(function(){
    var range = window.getSelection();
    alert(range);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><p>ComoeupossofazerumseletordetextodentrodoHTMLdeformaqueeupossateropçõesquandodeterminadotextodentrodeumatagp,porexemplo,forselecionado?</p>

  

Function reference getSelection ()

You can designate a function to execute when an event occurs in the element.

The event for when a text is selected in the tag would be the event onSelect .

For example, you want the selected text to appear in the console, so you would do something like:

<p onselect="funcao()">(conteúdo aqui)</p>

<script>function funcao() { alert('Selecionou um texto'); }</script>

And on the function receive data from an input, I believe that this input should be captured in the function that the event calls.

I do not know if it's exactly what you want, but you can leave the% custom% using textarea .

TinyMCE is a textarea with editable freatures. You can leave from only bold and italic, to the possibility of viewing the html code being generated from behind, among others. I have been using it for some time, it's very good.