Question

我有一个网络应用程序，当用户点击按钮时，用户可以在iframe（富文本编辑器）上输入iframe。用户单击新iframe按钮时的HTML代码： <input name="add_button" type="button" value="New frame" onClick="javascript:add_new_frame();"/>

用于创建iframe和designmode的JavaScript代码

 function add_new_frame(){
$("<iframe class=\"a\" id="a" name="a"/>").appendTo(id);
        var editor = document.getElementById ("a");
        editorDoc = editor.contentWindow.document; 
        editorDoc1 = document.getElementById ("a").contentDocument;                 
        var editorBody = editorDoc.body;

         if ('spellcheck' in editorBody) {    // Firefox
            editorBody.spellcheck = false;

        }

        if ('contentEditable' in editorBody) {
                // allow contentEditable
            editorBody.contentEditable = true;
             editorDoc1.designMode = "on";    
        }
        else {  
          if ('designMode' in editorDoc1) {

                editorDoc1.designMode = "on";                
            }            

        }   

    }

我已经在上面测试过（chrome，opera，safari，IE），它的工作正常。但是，它没有在FF上工作，iframe出现但我无法编辑它（设计模式不起作用）。有什么办法吗？抱歉英文不好

Answer 1

您在iframe元素中错过了\来掩盖“

function add_new_frame(){
$("<iframe class=\"a\" id=\"a\" name=\"a\"/>").appendTo(id);
        var editor = document.getElementById ("a");
        editorDoc = editor.contentWindow.document; 
        editorDoc1 = document.getElementById ("a").contentDocument;                 
        var editorBody = editorDoc.body;

         if ('spellcheck' in editorBody) {    // Firefox
            editorBody.spellcheck = false;

        }

        if ('contentEditable' in editorBody) {
                // allow contentEditable
            editorBody.contentEditable = true;
             editorDoc1.designMode = "on";    
        }
        else {  
          if ('designMode' in editorDoc1) {

                editorDoc1.designMode = "on";                
            }            

        }   

    }

Answer 2

<html>    <head>   <title>Untitled Page</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $ = jQuery;
        function frame() {
            $("<iframe class=\"a\" id=\"a\" name=\"a\"/>").appendTo(id);
            var editor = document.getElementById("a");
            editorDoc = editor.contentWindow.document;
            editorDoc1 = document.getElementById("a").contentDocument;
            var editorBody = editorDoc.body;
            if ('spellcheck' in editorBody) {    // Firefox
                editorBody.spellcheck = false;

            }
            if ('contentEditable' in editorBody) {
                // allow contentEditable
                editorBody.contentEditable = true;
                editorDoc1.designMode = "on";
            }
            else {
                if ('designMode' in editorDoc1) {

                    editorDoc1.designMode = "on";
                }

            }
        }     

    </script>
</head>
<body>
    <input name="add_button" type="button" value="New frame" onclick="frame()" />
    <p id="id">
        contents</p>
</body>
</html>

firefox iframe designmode无法正常工作

2 个答案: