Question

问题在于execCommand，即使在IE10中也没有在IE中正确执行。例如，当我点击粗体并继续键入时，在IE中它不会使字母变为粗体，我必须选择文本并单击粗体以使其变为粗体。在所有其他浏览器中，当我点击粗体按钮并继续输入时，它会使字母变为粗体。

以下是jsfiddle http://jsfiddle.net/Q65Qt/

的链接

这是代码

var oDoc, sDefTxt;

function initDoc() {
    oDoc = document.getElementById("textBox");
    sDefTxt = oDoc.innerHTML;
    if (document.compForm.switchMode.checked) {
        setDocMode(true);
    }
}

function formatDoc(sCmd, sValue) {
    if (validateMode()) {
        document.execCommand(sCmd, false, null);
        oDoc.focus();
    }
}

function validateMode() {
    if (!document.compForm.switchMode.checked) {
        return true;
    }
    alert("Uncheck \"Show HTML\".");
    return false;
}

function setDocMode(bToSource) {
    var oContent;
    if (bToSource) {
        oContent = document.createTextNode(oDoc.innerHTML);
        oDoc.innerHTML = "";
        var oPre = document.createElement("pre");
        oDoc.contentEditable = false;
        oPre.id = "sourceText";
        oPre.contentEditable = true;
        oPre.appendChild(oContent);
        oDoc.appendChild(oPre);
    } else {
        if (document.all) {
            oDoc.innerHTML = oDoc.innerText;
        } else {
            oContent = document.createRange();
            oContent.selectNodeContents(oDoc.firstChild);
            oDoc.innerHTML = oContent.toString();
        }
        oDoc.contentEditable = true;
    }
    oDoc.focus();
}

以下是jsfiddle http://jsfiddle.net/Q65Qt/

的链接

请帮助，提前致谢

Answer 1

问题不在于document.execCommand()。相反，问题似乎是当单击按钮时可编辑元素失去焦点，因此在焦点恢复时失去了粗体。

最简单的解决方案是防止按钮点击窃取焦点。您可以使用mousedown事件而不是click事件来阻止浏览器的默认行为来执行此操作：

http://jsfiddle.net/Q65Qt/1/

或者，您可以使按钮无法选择。例如，请参阅https://stackoverflow.com/a/12527098/96100。

execCommand无法正常工作

1 个答案: