javascript - How to wrap a html tag around a text selected in an input? -

the problem is: have input text type element, , button beside it.

once button clicked, selected text inside input must wrap html element. example, when button clicked, selected text wrapped <span style='color:red'></span> !

does has solution ?

as @rémyj wrote, can use jquery select event, selection. try this:

var start, end; $('#tf').select(function(e) {     start = e.target.selectionstart;     end = e.target.selectionend; });  $('.wrap').click(function() {     var val = $('#tf').val();     var newval = val.substr(0, start) + '!' + val.substr(start, (end-start)) + '!' + val.substr(end);     $('#tf').val(newval); }); 

html:

<input type="text" id="tf">  <button type="button" class="wrap">wrap</button> 

http://jsfiddle.net/qh95xyeq/