I have a contentEditable Div and I want remove any formatting especially for copy and paste text.
I'd like to add my solution to this issue:
ContentEditableElement.addEventListener('input', function(ev) {
if(ev.target.innerHTML != ev.target.textContent) {
// determine position of the text caret
var caretPos = 0,
sel, range;
sel = window.getSelection();
if (sel.rangeCount) {
range = sel.getRangeAt(0);
var children = ev.target.childNodes;
var keepLooping = true;
for(let i = 0; keepLooping; i++) {
if(children[i] == range.commonAncestorContainer || children[i] == range.commonAncestorContainer.parentNode) {
caretPos += range.endOffset;
keepLooping = false;
} else {
caretPos += children[i].textContent.length;
}
}
// set the element's innerHTML to its textContent
ev.target.innerHTML = ev.target.textContent;
// put the caret where it was before
range = document.createRange();
range.setStart(ev.target.childNodes[0], caretPos);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
}
}
});
(this isn't compatible with older versions of IE)