如何使execCommand在IE和Firefox上工作?

时间:2017-02-21 04:02:00

标签: javascript html internet-explorer firefox rich-text-editor

我正在使用contenteditable div创建一个富文本编辑器。代码在chrome中运行良好,但它似乎在IE和Firefox中不起作用。只有格式化在IE和Firefox中工作,但突出显示的功能并没有工作。 以下是代码链接 https://jsbin.com/vunenociwu

<div class='rte'>
<div class='rtecontrol'>
    <img class="hi" onclick="document.execCommand('bold',false,null);hmm();" src='http://jeevan.tx0.org/rteditor/icons/text_bold.png' unselectable="on" >
    <img class="hi" onclick="document.execCommand('italic',false,null);hmm();" src='http://jeevan.tx0.org/rteditor/icons/text_italic.png'>
    <img class="hi" onclick ="document.execCommand('underline',false,null);hmm();" src='http://jeevan.tx0.org/rteditor/icons/text_underline.png'>
</div>
<div class='rtearea'  contenteditable='true'>
    Hello world;
</div>

    var imageTags = document.getElementsByClassName("hi");

    setInterval(function () {
    var isBold = document.queryCommandValue("Bold");
    var isItalic = document.queryCommandValue("Italic");
    var isUnderlined = document.queryCommandValue("Underline");
    if (isBold === 'true') {
        imageTags[0].style.opacity = 1;
    } else {
        imageTags[0].style.opacity = 0.5;
    }

    if (isItalic === 'true') {
        imageTags[1].style.opacity = 1;
    } else {
        imageTags[1].style.opacity = 0.5;
    }
    if (isUnderlined === 'true') {
        imageTags[2].style.opacity = 1;
    } else {
        imageTags[2].style.opacity = 0.5;
    }
}, 100)'

0 个答案:

没有答案