jQuery 编辑器插件 - 未调用执行命令

Question

我正在使用 jHTMLArea jQuery 插件 (http://jhtmlarea.codeplex.com/)。它使用嵌入式 iframe 创建了一个简单的 WYSIWYG 编辑器。我想摆脱 iframe 并改用 ContentEditable div。

问题是我可以让它运行 execcommand 函数，以便将格式更改应用于编辑器。

看看http://jsfiddle.net/mwillmott/neXkk/ 看看我的实现。

任何帮助将不胜感激！

Answer 1

如果您在 Firefox 中尝试使用 Firebug，部分答案会显示在控制台中。问题是document.execCommand()需要三个参数：

document.execCommand("Bold", false, null);

第二个是特定于 IE 的旧版本，几乎总是false。最后一个是与命令关联的值，在“Bold”的情况下可以为 null，因为粗体命令没有值。

另一个更大的问题是按下工具栏按钮时选择被破坏。您需要通过使用mousedown 事件而不是click 来防止这种情况，或者通过防止按钮抓住焦点来更好地防止这种情况发生。例如，请参阅this answer。

最后，我认为缺少一个名为editor 的属性，它应该是对包含可编辑内容的文档的引用。

我在您的演示中添加了针对这些问题的修复：http://jsfiddle.net/neXkk/2/。仅在 Firefox 中测试，您可能需要对 IE 进行更多调整。