In most browsers, you can use the insertNode() method of the Range you obtain from the selection. In IE < 9 you can use pasteHTML(), as you mentioned. Below is a function to do this in all major browsers. If content is already selected, it is replaced, so this is effectively a paste operation. Also, … Read more
The following code assumes: There is always a single text node within the editable <div> and no other nodes The editable div does not have the CSS white-space property set to pre If you need a more general approach that will work content with nested elements, try this answer: https://stackoverflow.com/a/4812022/96100 Code: function getCaretPosition(editableDiv) { var … Read more
In most browsers, you need the Range and Selection objects. You specify each of the selection boundaries as a node and an offset within that node. For example, to set the caret to the fifth character of the second line of text, you’d do the following: function setCaret() { var el = document.getElementById(“editable”) var range … Read more
2022 update As pointed out in the comments, this doesn’t answer the question asked, which wanted the equivalent of the change event rather than the input event. However, I’ll leave it here as is. Original answer I’d suggest attaching listeners to key events fired by the editable element, though you need to be aware that … Read more