JSFiddle - React, Tailwind, and code Playground
by mohammadAdil
HTML
<textarea rows="3" cols="50">
Cake cupcake sesame snaps. Cookie marshmallow bonbon faworki pie caramels. Icing tootsie roll jelly-o pudding bear claw. Candy topping fruitcake jelly... {Type something after this..}
</textarea>
JavaScript
$('textarea').on("keyup", function(e) {
var pos = $('textarea').caret();
$('body').append(pos.begin);
$(this).val($(this).val().replace(/'/g,"’"));
setTimeout(function(){
},500);
$('textarea').caret(pos);
});
$.fn.caret = function (begin, end)
{
if (this.length == 0) return;
if (typeof begin == 'number')
{
end = (typeof end == 'number') ? end : begin;
return this.each(function ()
{
if (this.setSelectionRange)
{
this.setSelectionRange(begin, end);
} else if (this.createTextRange)
{
var range = this.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', begin);
try { range.select(); } catch (ex) { }
}
});
} else
{
if (this[0].setSelectionRange)
{
begin = this[0].selectionStart;
end = this[0].selectionEnd;
} else if (document.selection && document.selection.createRange)
{
var range = document.selection.createRange();
begin = 0 - range.duplicate().moveStart('character', -100000);
end = begin + range.text.length;
}
return { begin: begin, end: end };
}
}