Question

这是我正在处理的WYSIWYG文本编辑器的代码。我正在研究HTML到BBCODE，反之亦然。它在Fire Fox中运行良好，但在Internet Explorer中运行不正常。想法？

function textstyle(a) {
    document.getElementById(a).style.visibility = 'visible';
    document.getElementById('editor').contentWindow.focus();
}

function option(a,b) {
    document.getElementById('editor').contentWindow.document.execCommand(a, false, b);
    document.getElementById('editor').contentWindow.focus();
}

function button(a) {
    document.getElementById('editor').contentWindow.document.execCommand(a, false, null);
    document.getElementById('editor').contentWindow.focus();
}

var colorSelection;

function selectColor(selection) {
    colorSelection = selection;
    document.getElementById('colorSelector').style.left = 0 + document.getElementById(selection).offsetLeft + "px";
    document.getElementById('colorSelector').style.top = 0 + document.getElementById(selection).offsetTop + document.getElementById(selection).offsetHeight + "px";
    document.getElementById('colorSelector').style.visibility = 'visible';
    return;
}

function changeColor(colorCode) {
    document.getElementById('editor').contentWindow.document.execCommand(colorSelection, false, colorCode);
    document.getElementById('colorSelector').style.visibility = 'hidden';
    document.getElementById('editor').contentWindow.focus();
    return;
}

function dismissmenu()
{
    document.getElementById("colorSelector").style.visibility = 'hidden';
    document.getElementById("fontlist").style.visibility = 'hidden';
    document.getElementById("formatlist").style.visibility = 'hidden';
    document.getElementById("sizelist").style.visibility = 'hidden';
}

function Start() {
    document.getElementById('editor').contentWindow.document.designMode = "on";
    document.getElementById('editor').contentWindow.document.execCommand("styleWithCSS", false, "false");

    try {
        document.getElementById('editor').contentWindow.document.execCommand("undo", false, null);
        editormode = "true";
    }  catch (e) {
        editormode = "false";
    }

    if (document.addEventListener) {
        document.addEventListener("mouseup", dismissmenu, true);
        document.getElementById("editor").contentWindow.document.addEventListener("mouseup", dismissmenu, true);
        document.addEventListener("keypress", dismissmenu, true);
        document.getElementById("editor").contentWindow.document.addEventListener("keypress", dismissmenu, true);
    } else if (document.attachEvent) {
        document.attachEvent("mouseup", dismissmenu, true);
        document.getElementById("editor").contentWindow.document.attachEvent("mouseup", dismissmenu, true);
        document.attachEvent("keypress", dismissmenu, true);
        document.getElementById("editor").contentWindow.document.attachEvent("keypress", dismissmenu, true);
    }
}

function switchEditorMode() {
    if (editormode == "true") {

        var replaceTagsByMode = function(html, editormode) {
            var tags = {};
            for (var i=0, a=['b', 'i', 'u', 'strike', 'sub', 'sup']; i<a.length; i++) {
                tags[['<', a[i], '>'].join('')] = ['[', a[i], ']'].join('');
                tags[['</', a[i], '>'].join('')] = ['[/', a[i], ']'].join('');
            }
            for (var html_tag in tags) {
                if (tags.hasOwnProperty(html_tag)) {
                    html = html.replace.apply(
                    html, editormode ? [html_tag, tags[html_tag], 'g'] : [tags[html_tag], html_tag, 'g']);
                }
            }
            return html;
        };

        var editor_body = document.getElementById('editor').contentWindow.document.body;
        editor_body.innerHTML = replaceTagsByMode(editor_body.innerHTML, editormode);


        editormode = "false";

    } else {

        var replaceTagsByMode = function(html, editormode) {
            var tags = {};
            for (var i=0, a=['b', 'i', 'u', 'strike', 'sub', 'sup']; i<a.length; i++) {
                tags[['[', a[i], ']'].join('')] = ['<', a[i], '>'].join('');
                tags[['[/', a[i], ']'].join('')] = ['</', a[i], '>'].join('');
            }
            for (var html_tag in tags) {
                if (tags.hasOwnProperty(html_tag)) {
                    html = html.replace.apply(
                    html, editormode ? [html_tag, tags[html_tag], 'g'] : [tags[html_tag], html_tag, 'g']);
                }
            }
            return html;
        };

        var editor_body = document.getElementById('editor').contentWindow.document.body;
        editor_body.innerHTML = replaceTagsByMode(editor_body.innerHTML, editormode);


        editormode = "true";

    }
}

Answer 1

在你的一条评论中，你注意到了这一点：

执行此类操作的行   给出错误：

的document.getElementById（ '编辑'）。contentWindow.document.execCommand（ “styleWithCSS”，   false，“false”）;

它说这是一个无效的论点。

这可能是因为styleWithCSS不是execCommand的有效命令标识符：

http://msdn.microsoft.com/en-us/library/ms533049%28v=VS.85%29.aspx

Answer 2

刚刚通过类似的问题，但注意到了这一点：

document.attachEvent("mouseup", dismissmenu, true);

应该像我想的那样'.attachEvent'：

document.attachEvent("onmouseup", dismissmenu, true);

我知道一个或另一个事件附件方法直接使用'on'部分。我相信IE确实如此。另外，与文档相反，某些事件更好地附加到“body”元素。我使用Dojo工具包和dojo.connect（）函数进行常规事件设置，并将onclick等事件附加到body元素。该工具包有助于解决上述语法差异。将这样的问题排除在外。

Javascript IE问题

2 个答案: