Create indent Tab in Contenteditable

Create indent Tab in Contenteditable

by Adi Jaya

HTML

<div contenteditable id="test">
 ready indent with tab keyboard
</div>

CSS

div#test{
  height: 200px;
  width:80%;
  border: 2px solid green;
  margin :0 auto;
}

JavaScript

function indent(e){
   if(e.keyCode === 9){
       e.preventDefault();
       	var range = window.getSelection().getRangeAt(0);
				var createTextNode = document.createTextNode("\u00a0\u00a0\u00a0\u00a0");
       			range.insertNode(createTextNode);
       			range.setStartAfter(createTextNode);
       			range.setEndAfter(createTextNode);         
   }
}

document.querySelector("#test").addEventListener("keydown",indent);