JSFiddle - React, Tailwind, and code Playground
HTML
<textarea rows="5" cols='50' id='ta'> </textarea>
JavaScript
var keyPressed = null;
var timesPressed = 0;
var tabString = '';
var lastKeyPressed = null;
$(function(){
$("textarea").keydown(function(e) {
var $this, end, start;
if (e.keyCode === 9 || e.which === 9) {
start = this.selectionStart;
end = this.selectionEnd;
$this = $(this);
$this.val(
$this.val().substring(0, start)
+ "\t" + $this.val().substring(end)
);
this.selectionStart = this.selectionEnd = start + 1;
keyPressed = e.keyCode || e.which;
timesPressed = timesPressed +1;
return false;
}else if(e.keyCode === 13 && keyPressed === 9){
start = this.selectionStart;
end = this.selectionEnd;
$this = $(this);
tabString += '\t';
$this.val(
$this.val().substring(0, start)
+ "\r"+tabString + $this.val().substring(end)
);
this.selectionStart = this.selectionEnd = start + timesPressed +1;
lastKeyPressed = e.keyCode;
return false;
}else if((e.keyCode === 8 || e.which === 8) && lastKeyPressed === 9){
keyPressed = null;
timesPressed = 0;
tabString = '';
}
});
});