问题
I am working on a contenteditable div to make a simple RichText-Editor. One of the requirement I have is to be able insert html chunk at cursor postion on a button event.
I was able to get that part working fine by using range, selection, range.insertNode(nodeHTML) or range.pasteHTML(nodeHTML) based on browser. But I couldn't get two things, which ideally I would like to have
- To be Able to undo the inserted node, using browser's undo. Somehow, browser ignores above actions.
- To move the cursor at the end of inserted node. So that user can start writing after
I know I can use something out of many editors available, which does this very well, but If I get this I would not have to. Any help or even suggestions are welcome.
Thanks.
回答1:
Answer rewritten August 2013
Unfortunately not, although things are improving. Programmatic DOM mutations other than those triggered by document.execCommand() do not go on the browser's built-in undo stack. However, there have been two recent developments:
- IE 11 has new ms-beginUndoUnit and ms-endUndoUnit commands
- There is a spec in the works for an undo stack available to web developers, parts of which have been implemented in WebKit and Firefox (note: it's disabled by default in Firefox and apparently also in WebKit).
Until the situation improves, you could use document.execCommand("InsertHTML", false, "<b>Some html</b>"); but this is not supported in IE.
来源：https://stackoverflow.com/questions/8543252/can-a-range-insertnode-be-undone-using-browsers-undo-in-a-contenteditable-di