How can I make a text selector within HTML so that I can have options when certain text within a p tag, for example, is selected?
How can I make a text selector within HTML so that I can have options when certain text within a p tag, for example, is selected?
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.