0

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

的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()存在的原因。

而且，我知道还有其他免费的文本编辑器可供我下载和使用，所以请不要向我推荐任何此类解决方案，也不要问我为什么必须重新发明轮子。仅当您知道我哪里出错并且您确实可以帮助我解决问题时才回答。

4

1 回答 1

2

FF 以空白页为目标引发弹出警报，因为您正在调用该函数window.open，而不是您应该调用document.open.

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

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

请参阅open() 方法

这应该适合你：

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-10T08:27:31.677 回答