iframe和firefox问题

我正在使用HTML/Javascript设计一个简单的富文本编辑器。它使用iframe。虽然它在IE6（以及可能更新的IE版本）中运行良好，但它在FireFox中被破坏了。 iframe无法以任何方式编辑或使用。iframe和firefox问题

的HTML <body>

<input type="button" id="bold" class="Button" value="B" onClick="fontEdit('bold');"> 
<input type="button" id="italic" class="Button" value="I" onClick="fontEdit('italic');"> 
<input type="button" id="underline" class="Button" value="U" onClick="fontEdit('underline');"> 
<hr> 
<iframe id="TextEditor" class="TextEditor"></iframe>

的JavaScript（对于IE）

TextEditor.document.designMode="on"; 
TextEditor.document.open(); 
TextEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); 
TextEditor.document.close(); 
TextEditor.focus();

上述脚本使得iframe中在IE中编辑。在FF中没有这样做。于是，我改变了一些事情FF版本 -

的JavaScript（对于FF）

id("TextEditor").contentWindow.designMode="on"; 
id("TextEditor").contentWindow.open(); //this line is responsible for pop-ups 
id("TextEditor").contentWindow.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console. 
id("TextEditor").contentWindow.close(); 
id("TextEditor").focus();

这部分代码，使FF挑起弹出警报空白页面作为目标。它仍然是坏的。现在什么都遵循的东西一般功能，如id()和fontEdit() -

function fontEdit(x,y){ 
    TextEditor.document.execCommand(x,"",y); 
    TextEditor.focus(); 
} 

function id(id){ 
    return document.getElementById(id); 
} 

function tag(tag){ 
    return document.getElementsByTagName(tag); 
}

我敢肯定，FF不处理iframe的这种方式。那么如何让iframe用作富文本编辑器，而不显示弹出窗口。请尽量避免使用jQuery，因为我还没有那么好。这就是为什么像id()和tag()这样的自定义功能存在。

而且，我知道，还有其他免费的文本编辑器为我下载和使用，所以请不要建议我任何这样的解决方案，不要问我为什么我必须重新发明轮子。只有回答如果你知道我要去哪里错了，如果你真的可以帮助我解决了这个问题。

来源

2012-08-10 Samik Sengupta

由于您正在调用函数window.open而不是您请拨打document.open，因此会激发一个空白页作为目标的弹出式警报。

window.open：打开一个新的浏览器窗口。

document.open：它打开输出流以收集任何document.write()或document.writeln()方法的输出。完成所有写操作后，document.close()方法会显示写入输出流的任何输出。注意：如果目标文件已经存在，它将被清除。

见The open() method

这应该为你工作：

id("TextEditor").contentWindow.document.designMode="on"; 
id("TextEditor").contentWindow.document.open(); //this line is responsible for pop-ups 
id("TextEditor").contentWindow.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console. 
id("TextEditor").contentWindow.document.close();

来源

2012-08-10 08:27:31 mabbas

这完美地工作。谢谢。 – 2012-08-10 08:28:50

@Samik，作为一个额外的部分（本身不值得回答，尤其是这个答案是正确的），将id（“TextEditor”）。contentWindow.document'设置为一个变量也会更有效率 - 相反比必须一遍又一遍地找到物体 – freefaller 2012-08-10 08:31:23

@m。阿巴斯 - 当我写上述评论时，你从答案中删除了解释。我建议你把它放回去（如果可能的话），因为对于未来找到这个问题/答案的人来说，总是很好的理解**为什么**你的答案有效。 – freefaller 2012-08-10 08:32:39

iframe和firefox问题

回答

相关问题