Javascript Internet Explorer 中的 execCommand("insertHTML", ...)
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3398378/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
execCommand("insertHTML", ...) in Internet Explorer
提问by Martin
I'm building a wysiwyg-editor with an editable iframe using document.execCommand(). Now i need to use the "insertHTML"command which works perfectly in Chrome and Firefox but of course it doesn't work in Internet Explorer:
我正在使用document.execCommand(). 现在我需要使用"insertHTML"在 Chrome 和 Firefox 中完美运行的命令，但当然它在 Internet Explorer 中不起作用：
function run() {
document.getElementById("target").focus();
document.execCommand("insertHTML", false, "<b>ins</b>");
}<div contenteditable id="target">contenteditable</div>
<button onclick="run()">contenteditable.focus() + document.execCommand("insertHTML", false, "<b>ins</b>")</button>What is the standard solution to this problem? It's okay if it only works in IE8 but IE7-support would be nice too.
这个问题的标准解决方案是什么？如果它只适用于 IE8 也没关系，但 IE7 支持也会很好。
回答by Tim Down
In IE <= 10 you can use the pasteHTMLmethod of the TextRangerepresenting the selection:
在 IE <= 10 中，您可以使用表示选择的pasteHTML方法TextRange：
var doc = document.getElementById("your_iframe").contentWindow.document;
if (doc.selection && doc.selection.createRange) {
var range = doc.selection.createRange();
if (range.pasteHTML) {
range.pasteHTML("<b>Some bold text</b>");
}
}
UPDATE
更新
In IE 11, document.selectionis gone and insertHTMLis still not supported, so you'll need something like the following:
在 IE 11 中，document.selection已经消失并且insertHTML仍然不受支持，因此您需要类似以下内容：
回答by distortions
In case you haven't found anything yet,
如果你还没有找到任何东西，
I had a button that would add html into an iframe, and was causing an error in IE8 when I clicked the button and no text was selected (i.e. when I had the blinking caret). It turned out that the button itself was getting selected (despite having unselectable="on"), and causing javascript to throw up the error. When I changed the button to a div (with unselectable on) it worked fine, in IE8 and FF.
我有一个按钮可以将 html 添加到 iframe 中，当我单击该按钮并且没有选择文本时（即当我有闪烁的插入符号时）导致 IE8 中的错误。结果是按钮本身被选中（尽管有 unselectable="on"），并导致 javascript 抛出错误。当我将按钮更改为 div（无法选择）时，它在 IE8 和 FF 中运行良好。
Hope this helps.
希望这可以帮助。
回答by David
I know this is extremely old, but since IE is still a problem, here is a better way which does not even use execCommand.
我知道这是非常古老的，但由于 IE 仍然是一个问题，这里有一个更好的方法，它甚至不使用execCommand.
This is missing some checks, like ensuring you're in the right container to be adding an image.
这缺少一些检查，例如确保您在正确的容器中添加图像。
var sel = window.getSelection();
var range = sel.getRangeAt(0);
var frag = document.createDocumentFragment();
var img = document.createElement("img");
// add image properties here
frag.appendChild(img);
range.insertNode(frag);
回答by user3126867
var doc = document.getElementById("your_iframe").contentWindow.document;
// IE <= 10
if (document.selection){
var range = doc.selection.createRange();
range.pasteHTML("<b>Some bold text</b>");
// IE 11 && Firefox, Opera .....
}else if(document.getSelection){
var range = doc.getSelection().getRangeAt(0);
var nnode = doc.createElement("b");
range.surroundContents(nnode);
nnode.innerHTML = "Some bold text";
};
